我正在使用 AJAX 来获取一些 HTML 标记。我想使用find() 将获取的标记中的一些样式标签（带有类）附加到我自己的文档中。但是，jQuery 似乎不喜欢下面的方法。
（链接因缺乏声誉而被删除）
有人能解释一下为什么这不起作用，并指出我正确的方向吗？
提前谢谢你。
innerHTML 而不是.html() 更简单，因为设置innerHTML 不会评估脚本并允许.find() 起作用。 http://jsfiddle.net/T6QCR/8/
感谢您的帮助！
【问题讨论】：
标签： javascript jquery html styles find
来自jQuery function documentation for the case you are using：
(...) 如果字符串看起来是 HTML sn-p，jQuery 会尝试 按照 HTML 的描述创建新的 DOM 元素。然后是一个 jQuery 对象 被创建并返回引用这些元素。你可以执行 此对象上的任何常用 jQuery 方法。
(...)
如果 HTML 比没有属性的单个标签更复杂，如 在上面的例子中，元素的实际创建是 由浏览器的 innerHTML 机制处理。在大多数情况下，jQuery 创建一个新元素并设置 元素到传入的 HTML sn-p。
(...)
在传入复杂的 HTML 时，某些浏览器可能不会生成 DOM 这完全复制了提供的 HTML 源代码。如前所述，jQuery 使用浏览器的 .innerHTML 属性来解析传递的 HTML 和 将其插入当前文档。在此过程中，一些 浏览器过滤掉某些元素，例如 , , 或 元素。因此，插入的元素可能不会 代表原始字符串传递。
The documentation 推荐使用$.parseHtml()
要将字符串显式解析为 HTML，请使用 $.parseHTML() 方法。
$.filter 而不是 $.find
如您所述，$.find 不适用于此示例。我已经成功地用$.filter 调用替换了它。
// this works
$html.filter('.test');
// this doesn't works
$html.find('.test');
// better if you filter also by tag
// surely you will have more tags other than <style> on the retrieved html
$html.filter('style.test');
【讨论】：
.find() 只是不适用于样式标签。即使它们只是常规节点。 （使用 parseHTML 时）
$.parseHtml(html) 返回一个数组（你的小提琴中只有一维对应<style> 标签）。使用$( $.parseHtml(html) )，您将获得一个查询有length==1 的jQuery 对象并存储<style> DOM 对象。当您执行 $html.find('.test')` 时，您试图在 <style> DOM 对象中找到 '.test'，因此找不到任何结果。
.find() 不起作用。您可以改用$.filter()。看看我对答案所做的更新。
body 未定义，控制台也会以错误的方式给出指示。如果您想使用 jQuery 选择标记主体并附加样式，那么您需要使用适当的选择器：
$("body").append($style);
【讨论】：
.find-ed。见jsfiddle.net/T6QCR/4 当使用console.log($style) 来检查 $style.length 的长度是多少时，它显示为 0。它应该显示为 1 并包含样式元素。
<style> 元素不能有class 属性，因为Uncaught SyntaxError: Unexpected identifier。
这段代码应该可以工作：
var html = '<html><head><style>aaa</style></head></html>';
var $html = $.parseHTML(html);
$.each($html, function(i, el) {
if(el.nodeName == "STYLE") {
$("head").append(el.outerHTML);
return false;
}
});
【讨论】：
我不太确定这是为什么，但它与文档模型及其工作方式有关。您不能只保存一个包含 html 文本的临时变量，您需要将其全部放在以某种方式附加到文档的元素（如 div）中。这个 div 可以从用户的视图中隐藏。
<html>
<head>
<div></div>
</head>
<body>
<script>
jQuery(document).ready(function($) {
$('div').hide().html('<html><head><style class="test"></style></head></html>'); // From AJAX request
var $style = $('div').find('.test');
document.body.appendChild($style[0]);
});
</script>
</body>
</html>
【讨论】：