Question

所以我有类似

的东西

<ul>
<li> <a href="123.html">123</a></li>
<li> <a href="abc.html">abc</a></li>
</ul>

我的INDEX.HTML文件中的这个网站。除了加载更多列表和列表项之外。链接到的每个HTML页面都有如下部分：

<ul>
<li><strong>Time: </strong>12:00</li>
</ul>

我想要的是当用户看到INDEX.HTML页面时，时间被添加到结尾（来自相对链接）所以它读起来像

123 - 12:00
ABC - 13:00

有人可以帮忙吗？我意识到我可能需要内容（）和罚款（），但无处可见。所以基本上对于每个链接，我们转到相关的URL，抓住时间并在INDEX.HTML上添加原始行

感谢。

Answer 1

如果我理解您的问题，我相信您想要加载每个内页的内容以在主菜单中显示信息。如果是这种情况，那对性能来说是个坏主意。

如果您愿意，首先需要使用$.get功能加载HTML内容。然后使用结果，搜索所需的元素。

<强>更新

我更新了sample here。它只有一个链接，但现在用你的代码结构显示它。

基于此，我相信您的index.html代码将是这样的：

$("li a").each(function() {
    var src = $(this).attr("href");
    $.get(src, function(data) {
      var element = $("<div>").html(data);
      var time = element.find("li").contents().last().text();
      $("li").append(" - " + time);
    });
});

Answer 2

这个想法可能如下：

循环浏览li s。
获取href孩子的a属性。
向该页面发送ajax请求。
解析响应并使用jQuery找到合适的文本。
将该文字附加到li。

在jsFiddle上生成单独的页面并不是很容易，所以你必须根据你的情况改变一下。此外，您可能希望使选择器更严格（ul strong是我能用你的例子做的最好的。）

http://jsfiddle.net/3JQDz/

$("li").each(function() {
    var $li = $(this);
    var href = $li.find("a").attr("href");  // use this in your real case

    $.ajax({
        type: "POST",
        url: "/echo/html/",  // this is just the way to use ajax on jsFiddle
        data: {
            html: "<ul><li><strong>Time: </strong>12:00</li></ul>"
        },
        success: function(html) {
            // full document -> only the li -> its child nodes -> the last one (the text node) -> its text
            var time = $(html).find("li").contents().last().text();
            $li.append(" - " + time);
        }
    });
});

jQuery从外部页面获取特定内容

2 个答案: