0

所以我有类似的东西

<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
  • 美国广播公司 - 13:00

有人可以帮忙吗？我意识到我可能需要 contents() 和 fine() 但没有快速得到。所以基本上对于每个链接，我们都会转到有问题的 URL，抓住时间并将其添加到 INDEX.HTML 上的原始行

谢谢。

4

2 回答 2

2

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

如果您想这样做，您首先需要使用该$.get函数加载 HTML 内容。然后使用结果，搜索所需的元素。

更新

我在这里更新了示例。它只有一个链接，但现在与您的代码结构一起显示。

基于它，我相信您的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);
    });
});
于 2012-08-21T20:40:46.197 回答
2

这个想法可能如下：

  1. 遍历lis。
  2. 获取孩子的href属性。a
  3. 向该页面发送 ajax 请求。
  4. 使用 jQuery 解析响应并找到适当的文本。
  5. 将该文本附加到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);
        }
    });
});
于 2012-08-21T20:44:30.730 回答