2010-05-27 39 views
0

我已經從頁面(即活DOM)複製了一些文本節點並將它們存儲在一個數組中。是否有可能在活DOM中再次找到這些確切的節點?我需要使用普通的JavaScript。如何使用其複製/克隆在活動DOM中查找文本節點?

這基本上是我的項目是如何工作的:

  • 配置對象(使用CSS選擇器),其中有一些文字內容,以及該部分內可選小節(也使用CSS選擇器)指定頁的章節哪裏有文字內容應該被忽略。我使用的屬性名稱分別爲selectexclude
  • 使用Sizzle(jQuery的選擇器引擎),我爲每個select選擇器生成一個元素集合,然後克隆它。
  • 然後,我對select集合運行exclude選擇器,查找匹配的所有元素,並將它們從select集合中刪除。
  • 使用select集合與刪除的exclude部分,我遍歷它來構建只有文本節點的數組。
  • 我使用這個文本節點數組根據提供的可能在原始文本內容中的術語列表進行一些詞匹配。爲此,我創建了一個包含屬性的對象數組,這些屬性包括髮現術語的文本節點以及文本節點data內該術語所在的位置/偏移量。

鑑於後者的數組,我需要能夠將克隆的文本節點與發現它們的原始文本節點進行匹配。如果我可以做到這一點,我可以遍歷我的對象數組,首先找到對應於實時DOM(從中最初克隆)的文本節點,然後在我記錄的位置/偏移量處鏈接該項在對象中。

希望這有些道理 - 請讓我知道如果沒有,我可以提供更多的細節。這必須是確定性的 - 即,我不能只搜索具有相同data的文本節點的實時DOM,因爲這可能會導致誤報。

同樣,我必須在這裏使用普通的JavaScript,而不是jQuery或任何其他庫。

我感謝任何幫助!

回答

2

一般來說,你不能。克隆完成後,新克隆與舊節點具有不同的身份。沒有通用的方法將節點連接回克隆的節點。

如果您知道最頂層的克隆祖先節點以及它從中克隆的文檔中的節點,那麼您可以自然地使用其父級childNode列表中的每個祖先的索引從最頂層的祖先走到特定節點...但只是假設從克隆以來DOM都沒有發生變異。

否則,你會留下像走克隆的整個DOM克隆後,寫一個expando屬性到每一個節點是指源節點的一些可怕的黑客。

我不確定你爲什麼克隆節點。在你描述的過程中,當然你可以將實況文檔節點存儲在列表中,而不需要克隆?

+0

謝謝,bobince!你有一個好點 - 我克隆節點樹的原因是,我可以在不影響活動頁面的情況下移除'exclude'節點,然後保留對修改樹的引用以便以後輕鬆遍歷。我想我可以以某種方式將這些節點標記爲「無效」,然後在遍歷樹並累積文本節點時檢查該節點。作爲最佳實踐,你會有什麼建議 - 有沒有一種理想的方式可以將一些數據不加區分地附加到活動節點上,以便基本節點遍歷函數可以檢查這些數據? – Bungle 2010-05-27 13:55:02

+0

您可以設置非標準屬性,例如。 'element._my_thing = false'。這被稱爲expando屬性,由於沒有規範支持它,所以稍微皺眉,但所有瀏覽器都會讓你這樣做。 (還有DOM 3 Core'setUserData',但它的支持不太好)。將節點保存在'exclude'列表中並在遍歷時檢查每個節點以查看它們是否在列表中或不。 ('exclude.indexOf(node)!== - 1',只是並非所有的瀏覽器都支持'indexOf',但是對於後退的參考:https://developer.mozilla.org/En/Core_JavaScript_1.5_Reference/Objects/ Array/IndexOf – bobince 2010-05-27 14:12:21

+0

真棒,謝謝,我剛剛偶然發現了expando屬性的方法,它似乎工作正常,但我確實喜歡你的後一個建議,所以我會看看我能否得到這個工作。 ! – Bungle 2010-05-27 14:17:10