我檢查了頁面的HTML渲染:http://gothamist.com/2010/07/18/wikileaks_founder_no-show_at_nyc_ha.php這是什麼樣的HTML元素?報價?
,如果你看一下這個圖片,你可以看到,當我看着DOM有通過與報價單字符分解「作爲一個評論者」
http://img153.imageshack.us/f/screenshot20100730at840.png/
任何想法是什麼,以及如何將它們從DOM中刪除以獲得乾淨連續的文本?
謝謝!
我檢查了頁面的HTML渲染:http://gothamist.com/2010/07/18/wikileaks_founder_no-show_at_nyc_ha.php這是什麼樣的HTML元素?報價?
,如果你看一下這個圖片,你可以看到,當我看着DOM有通過與報價單字符分解「作爲一個評論者」
http://img153.imageshack.us/f/screenshot20100730at840.png/
任何想法是什麼,以及如何將它們從DOM中刪除以獲得乾淨連續的文本?
謝謝!
這是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
這些不是真正的元素,而是文本節點,因爲它們應該是。 HTML元素包含文本節點。
<p>text</p>
paragraph
元素不包含元素,它包含一個文本節點。
但我注意到的一件事是,您的標記無效,因此Firefox內的DOM樹與Chrome不一致。
該文本節點「作爲評註」應該是該段的含鉻的div
是使它關閉p
一個孩子,但span
(本款擁有)的無效性,使文本節點成爲兄弟。當HTML解析器創建樹時,它會到達<div>
並意識到它已經在p
和span
中,並且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
:
後你正確地標記它,你會看到文本節點應該住p
內。
這可能是您的瀏覽器。 FireBug中沒有這種東西。