3

目前我在一个html文件中嵌入了多个页面，每个页面底部都有一个导航栏来导航到另一个页面。

但是，不同页面中的导航栏在不同位置是相同的代码。因此，在导航栏中编辑一个小细节意味着我必须在所有这些位置更改（相同的）代码。此外，如果我以这种方式实现它，导航栏按钮的突出显示将无法正确运行。

实际上，导航栏的代码是相同的——它们都在相同的 div 标签内。因此，我认为必须有某种方法可以为所有这些导航栏重用一个代码？这样我就不必每次更改导航栏中的某些细节时一次又一次地编辑代码？（如果我有 10 页或更多，那将是一场灾难）

4

1 回答 1

2

您可以使用 JavaScript 在每个页面初始化时添加一个元素（确保此代码包含在每个 HTML 文档中）：

$(document).on('pageinit', '[data-role="page"]', function () {
    $(this).children('[data-role="content"]').append('<div class="my-nav-bar">...</div>');
});

.append()然后，您将在函数调用中为您的导航栏添加 HTML 。这使您可以保留一份代码副本，并在网站的每个页面上使用它。

这有一个额外的好处，即代码只需由用户下载一次，而不是为每个页面下载。

于 2012-05-07T23:23:40.620 回答