Question

我有以下代码：

$.post(
    url,
    send_to,
    function(data) {
        console.log($(data).find("img");
    }
);

我从服务器获得了一些结果，并希望在该结果HTML代码中找到src标记的img值，但它无效。

如何在收到的数据中搜索img标记？

Answer 1

您的代码应该可以正常运行。 jQuery function（$(data)）会将有效的HTML字符串转换为（解耦的）节点树。

请注意，find()会搜索调用它的元素或元素集合的后代。如果您的<img>位于HTML的顶层，请改用filter()。例如：

<!-- Returned HTML: -->
<p>Here's a nice image of a kitten:</p>
<img src="demonic_kitten.png" />
<p>Muhahahaha!</p>

/* JavaScript (callback function): */
var success = function(data) {
    console.log($(data).filter("img");
};

如果<img>不在顶层，请确保返回的数据是有效的HTML并且首先包含<img>。

Answer 2

如果不了解data变量在HTML方面包含的内容，很难看出出错的地方。如果您确定它只是从AJAX请求中返回的IMG标记，则使用find会尝试在您的IMG标记中搜索另一个IMG，并且应该调整到这个：

console.log($(data).attr("src"));

如果它不仅仅是HTML中返回的IMG标记，并且是一堆不同的标记，我建议将HTML包装成DIV标记，然后再将其发送回Javascript，例如，如果您返回的内容如下：

<p>Something</p>
<p>Something else</p>
<img src="something" />
<p>Something</p>

...而是返回这样的内容：

<div>
    <p>Something</p>
    <p>Something else</p>
    <img src="something" />
    <p>Something</p>
</div>

...这也会使您的原始代码有效。我还想考虑在你的jQuery AJAX请求中添加dataType选项：

$.post(
    url,
    send_to,
    function(data) {
        console.log($(data).find("img");
    },
    "html"
);

希望这有帮助！：）