Question

我已成功将html文件附加到我的网站，其中仅包含菜单和标题图片。我希望我网站上的每个网页都有相同的菜单，标题和结构。一切正常但我不知道如何编辑我使用追加函数（jquery）添加的div。

例如：假设我提到了一个名为“include.html”的文件，该文件包含一个名为“website”的div。有什么办法可以在追加后添加代码/内容给DIV吗？

我需要访问APPEND功能附加的DIVS，以便为每个页面添加唯一的文本/信息。

这里有一些代码：

示例页面：

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="cstyles.css">
<script type='text/javascript' src='jquery-1.9.1.js'></script>
<script type='text/javascript' src='menu2.js'></script>
<script type='text/javascript' src='menu_load.js'></script>
</head>
<body>
<script>loadContent(); 
    $(document).on('mouseenter', "#menulist", function() {
          mainmenu();
});
</script>
</body>
</html>

这是menu2.js代码：

function mainmenu() {
     $(" #menulist li").hover(function() {
         $(this).find('ul:first').css({
              visibility: "visible",
              display: "none"}).show(300);
         },function() {
              $(this).find('ul:first').css({visibility: "hidden"});
     });
}

$(document).ready(function() {
     mainmenu();
});

这是menu_load.js代码：

function loadContent() {
     $("body").append($("<div id='index'>").load("include.html"));
}

我试图这样做的原因是我想在包含网站的主DIV上添加唯一信息..如果有更好的方式这样做（没有JQUERY附加）我很想知道..

提前致谢！

Answer 1

是。找到id（或其他一些jquery方法来查找div），并在负载上调用一个函数：

function loadContent() {
  $("body").append($("<div id='index'></div>").load("include.html", {}, function() {
    $("#div_id").html(new_content);
  });
}

如果您有任何问题，请告诉我。

Answer 2

您可以将回调函数传递给jQuery中的load(...)调用。所以，你可以这样做：

$("body").append($("<div id='index'>").load("include.html", function () {
    $(this).append("<div>your html content</div>");
}));

这会将文本your html content插入div的末尾。显然，如果你想让它在其他地方，你可以使用除追加之外的东西。

Answer 3

使用html()或text() ..在div内添加内容为website的内容..在加载回调函数后附加include.html

回调函数：如果提供了“完整”回调，则会在后处理和执行HTML插入后执行。对jQuery集合中的每个元素触发一次回调，并依次设置为每个DOM元素。

试试这个

function loadContent()
{
  $("body").append($("<div id='index'>").load("include.html", function() {
       $("#website").text("HELLO"); // OR $("website").html("HELLO");
  });
}

编辑由Jquery Append函数添加的div代码

3 个答案: