从字符串加载时,jquery.html()仅返回第一个文本

Rud*_* W. 5 html javascript jquery dom

可以从字符串初始化一个jquery对象。处理ajax结果时通常会发生这种情况,即我正在尝试复制http://api.jquery.com/jQuery.post/

但是,我看到了奇怪的行为:

function test() {
    var content = $("<html><body><div>hello</div><div>world</div></body></html>");
    alert("content.text() = " + content.text());
    alert("content.html() = " + content.html());
}
Run Code Online (Sandbox Code Playgroud)

第一个警报显示:content.text()= helloworld

第二个警报显示:content.html()= hello

这里发生了什么事?

谢谢大家的解释。我最终在的另一层添加<div>了一个子项<body>,例如

<html>
 <body>
  <div>    <=== added
   <div>hello</div>
   <div>world</div>
  </div>
 </body>
</html>
Run Code Online (Sandbox Code Playgroud)

T.J*_*der 1

当解析包含元素的 HTML 片段时body,一般浏览器(jQuery 也这样做)将忽略除元素内部内容之外的所有内容body。所以你所拥有的最终相当于:

var content = $("<div>hello</div><div>world</div>");
alert("content.text() = " + content.text());
alert("content.html() = " + content.html());
Run Code Online (Sandbox Code Playgroud)

您最终会得到一个 jQuery 对象,其中包含两个元素: 元素div

在 jQuery 中,通常,当您将访问器函数(htmlvalcss等)用作 getter 时,它们仅使用集合中的第一个html元素,这就是上面所做的。text是 jQuery 中一个不寻常的访问器函数:它为您提供集合中所有元素的组合文本,而不仅仅是第一个元素。

我们可以在文档中看到这一点,但这仍然令人惊讶。从html

获取匹配元素集中第一个元素的HTML 内容或设置每个匹配元素的 HTML 内容。

text

获取匹配元素集中每个元素(包括其后代)的组合文本内容,或设置匹配元素的文本内容。

(我在这两种情况下都强调。)