Question

我正在尝试使用html（）来读取两个标签之间的内容。请注意，内容本身可能包含嵌套在其中的标记。我试过html（），innerHTML，clone（），所有这些都有同样的问题...如果我尝试读取像

这样的东西

<p id="firstnote>Today is <h1>Monday</h1>. Someone has a case of the
Mondays.</p>

它应该读成一个字符串

var string = "Today is <h1>Monday</h1>. Someone has a case of the Mondays."

包括h1标签。我得到的是 “今天是”

它甚至不是一个子元素的问题（我不认为），因为它不会返回“。有人有星期一的情况。”一部分。

我尝试过创建一个临时div并附加的技巧，但我遇到了同样的问题 - 最终在标签之间提取代码忽略了包括和初始内联之后的所有内容＆lt; 这是js

function parseblog () {
var blogarray = ["", "", "", ""];

$.get('blogtest.html', function(data) {
//Read blogs into array
blogarray[0] = $(data).find('#notes').html();
blogarray[1] = $(data).find('#firstblog').html();
blogarray[2] = $(data).find('#secondblog').html();
blogarray[3] = $(data).find('#thirdblog').html();

alert(blogarray[0]);
alert(blogarray[1]);
});}

用于测试的HTML

<div id="blog">
<h1 id="notes">Notes</h1>
<p id="firstblog">Monday February 23, 2015<h2>10:56am</h2>Another try</p>
<p id="secondblog">Hello World!</p>
<p id="thirdblog"></p>
</div>

第一个警报给了我注释。第二个提醒给了我2015年2月23日星期一

Answer 1

Headers inside paragraphs is invalid.您的HTML正在被解析：

<p id="firstnote">Today is </p>
<h1>Monday</h1>
. Someone has a case of the Mondays.
<p></p>

（每一行都是自己的节点）

然后，jQuery的.html()仅返回匹配集中第一个元素的HTML。在这种情况下，这是第一个<p>。

Answer 2

您的HTML无效。您不能在段落元素中包含h#标记。浏览器将更改HTML以使其有效。遇到H2时，会关闭段落标记。

来自MDN的说明：

开始标记是必需的。如果<p>，则可以省略结束标记 element后面紧跟一个<address>, <article>, <aside>, <blockquote>, <div>, <dl>, <fieldset>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hr>, <menu>, <nav>, <ol>, <pre>, <section>, <table>, <ul>或另一个<p>元素，如果没有父元素和父元素中的更多内容不是 <a>元素。

段落只能包含phrasing content。

Answer 3

段落标记内有标题标记。以下是我编写测试代码的方法。它增加了一些标签，因此代码更加清晰：

<div id="blog">
<h1 id="notes">Notes</h1>
<div id="firstblog">
<p class="date">Monday February 23, 2015</p>
<h2>10:56am</h2>
<p class="content">Another try</p>
</div> <!-- End of "firstblog" tag -->

<p id="secondblog">Hello World!</p>
<p id="thirdblog"></p>
</div> <!-- end of "blog" tag -->

jQuery html（）函数在看到标记时停止

3 个答案: