2010-07-31 45 views

回答

2

这是WebKit的检查是多么表示TextNode

你看到不止一个textnode环绕锚标记。

如果你倾倒childNodes为DIV,它看起来是这样的:

0: Text 
1: HTMLParagraphElement 
2: HTMLDivElement 
3: Text 
4: Text 
5: HTMLAnchorElement 
6: Text 
7: HTMLAnchorElement 
8: Text 
9: HTMLParagraphElement 
10: Text 
11: HTMLParagraphElement 
12: Text 
13: HTMLParagraphElement 
14: Text 

在侧元件检查,这些节点标记为Text将引号括起来。这只是元素检查器的一个功能。

任何想法是什么,以及如何将它们从DOM中剥离出来以获得干净连续的文本?

一些浏览器支持innerText

例如,在该网站上运行此:

document.querySelector('.asset-body').innerText

0

这些不是真正的元素,而是文本节点,因为它们应该是。 HTML元素包含文本节点。

<p>text</p> 

paragraph元素不包含元素,它包含一个文本节点。

但我注意到的一件事是,您的标记无效,因此Firefox内的DOM树与Chrome不一致。

该文本节点“作为评注”应该是该段的含铬的div是使它关闭p一个孩子,但span(本款拥有)的无效性,使文本节点成为兄弟。当HTML解析器创建树时,它会到达<div>并意识到它已经在pspan中,并且span不能包含div,因此它会关闭p并创建一个新元素div

Firefox的DOM树是宽松的,实际上允许嵌套继续。这是您所指的文本节点位置不一致的原因。

基本上,你有这样的:

<p><span><div>blah</div></span>As a commentor</p> 

浏览器把它变成

<p><span></span></p><div>blah</div>As a commentor 

Firefox允许它逃脱它

<p><span><div>blah</div></span>As a commentor</p> 

解决方法:验证您的HTML和不让span包含div

http://validator.w3.org/check?uri=http://gothamist.com/2010/07/18/wikileaks_founder_no-show_at_nyc_ha.php&charset=(detect+automatically)&doctype=Inline&group=0

后你正确地标记它,你会看到文本节点应该住p内。

0

这可能是您的浏览器。 FireBug中没有这种东西。