javascript - 用于多个项目的 Ajax 加载器脚本

Question

我有这样的列表元素

<ol class="listItem">
    <li id="#item-1" class="NewsFeedItem">
        <a href="someurl.com" class="threadLink">Example Url</a>
        <div class="attachedImage"></div>
    </li>
    <li id="#item-2" class="NewsFeedItem">
        <a href="someurl2.com" class="threadLink">Example Url 2</a>
        <div class="attachedImage"></div>
    </li>
    <li id="#item-3" class="NewsFeedItem">
        <a href="someurl3.com" class="threadLink">Example Url 3</a>
        <div class="attachedImage"></div>
    </li>
    ...
</ol>

我只想使用一个脚本来加载每个li的内容。我在这里写了一些代码，但它不起作用

$('.NewsFeedItem').each(function() {
var id = $(this).get(0).id;

$('#' + id + '.attachedImage').load( $('#' + id + '.threadLink').attr('href') + ' .firstPost .messageText img' );

});

我哪里错了？

Answer 1

你的代码很好，除了两点。要选择后代，您需要用空格分隔选择器，而这一行中缺少空格:

$('#' + id + ' .attachedImage').load( $('#' + id + ' .threadLink').attr('href') ...

像#id.attachedImage这样的选择器将查找ID为id的元素，并为其分配了attachedImage类。

如果您想选择一个元素，并为其分配了一个 attachedImage 类，并且该元素是 ID 为 id 的元素的后代，则需要编写选择器为#id .attachedImage。

<小时/>

编辑 1:

由于 id 中的值已经具有 #，因此您还需要从选择器中删除 #:

$( id + ' .attachedImage').load( $( id + ' .threadLink').attr('href') ...