如果我运行这段代码 -
var html= '<html><head></head><body><div class="bar"></div></body></html>';
console.log($(html).find('div'));
如果我运行此代码，我不会返回任何结果 -
var html= '<html><head></head><body><div><div class="bar"></div></div></body></html>';
console.log($(html).find('div'));
然后我得到一个返回结果 - 内部 div (<div class="bar"></div>）。我希望第一个代码片段返回一个结果，第二个代码片段返回两个结果。
同样，此代码不返回任何结果 -
var code = $("<div id='foo'>1</div><div id='bar'>2</div>");
console.log(code.find('div'));
但这段代码会提醒“div”两次 -
var code = $("<div id='foo'>1</div><div id='bar'>2</div>");
code.each(function() {
alert( this.nodeName );
})
鉴于第二个代码片段的结果，我预计第一个代码片段会返回两个结果。有人可以解释一下为什么我会得到这样的结果吗？
http://jsfiddle.net/ipr101/GTCuv/
让我们把这个问题分成两部分。
First:
var html= '<html><head></head><body><div class="bar"></div></body></html>';
console.log($(html).find('div'));
and
var html= '<html><head></head><body><div><div class="bar"></div></div></body></html>';
console.log($(html).find('div'));
不工作，因为根据jQuery() docs:
当传入复杂的 HTML 时，某些浏览器可能不会生成 DOM
完全复制了所提供的 HTML 源代码。如前所述，我们使用
浏览器的 .innerHTML 属性来解析传递的 HTML 并插入
将其添加到当前文档中。在此过程中，某些浏览器
过滤掉某些元素，例如<html>, <title>, or <head>元素。因此，插入的元素可能不具有代表性
原始字符串已通过。
- 在第一个代码块中，您的
<html>, <head>, and <body>标签被剥离，并且<div class="bar"></div>遗迹。find只在结果中搜索<div>，并且找不到任何东西。
- 在第二个代码块中，您的
<html>, <head>, and <body>标签被剥离，并且<div><div class="bar"></div></div>遗迹。find在结果中搜索，并找到一个<div>.
至于你的第二部分：
var code = $("<div id='foo'>1</div><div id='bar'>2</div>");
console.log(code.find('div'));
你首先给 jQuery 一个字符串，它会用这两个字符串将其变成一个 jQuery 对象<div>的。然后，find在每个搜索<div>，什么也没找到，也不返回任何结果。
Next, in
var code = $("<div id='foo'>1</div><div id='bar'>2</div>");
code.each(function() {
alert( this.nodeName );
})
each循环遍历 jQuery 对象，获取创建的两个对象中的每一个<div>的，并提醒他们的节点名称。因此，您会收到两个警报。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
