1. 程式人生 > >跨瀏覽器檢測某個節點是不是另一個節點的後代

跨瀏覽器檢測某個節點是不是另一個節點的後代

amp get 使用 etc contains eof engine 通過 col

1.通常我們使用contains()方法不通過在DOM文檔樹中查找即可獲得這個消息,傳入兩個參數,一個是祖先節點另一個是需要檢測的後臺節點。
2.通過compareDocumentPosition()確定節點之間的關系,返回一個表示該關系的位掩碼。

掩碼 節點關系
1   無關(給定的節點不在當前文檔中)
2 居前(給定的節點在DOM樹中)
4 居後(給定的節點在DOM樹中位於參考節點之後)
8 包含(給定的節點是參考節點的祖先)
16 被包含(給定節點是參考節點的後代)

function contains(refNode,otherNode){
            
if( typeof refNode.contains == "function" && (!client.engine.webkit || client.engine.webkit >= 522)){ return refNode.contains(otherNode); } else if (typeof refNode.compareDocumentPosition == "function"){ return !!(refNode.compareDocumentPosition(otherNode) & 16) }
else { var node = otherNode.parentNode do{ if(node === refNode){ return true }else{ node = node.parentNode } }while(node !== null);
return false } } function getContains(){ alert(contains(document.documentElement,document.body)) }

這個函數使用了三種方式來檢測。函數的第一個參數是參考節點,第二個參數是檢查節點。在函數體內,首先檢測refNode中是否存在contains()方法(能力檢測)。這一部分代碼還檢查了當前瀏覽器所用的Webkit版本號。如果方法存在而且不是Webkit

(!client.engine.webkit),則需要繼續執行代碼。如果瀏覽器是webkit且至少是Safari3(WebKit版本號為522或者更高,那麽可以繼續執行代碼),在Webkit版本號小於522的Safari瀏覽器中,contains()方法不能正常使用。

跨瀏覽器檢測某個節點是不是另一個節點的後代