開發(fā)人員經(jīng)常需要確定某個給定的節(jié)點是不是另一個節(jié)點的后代。為此,IE率先引入了contains() 方法,讓開發(fā)人員無須遍歷DOM文檔樹即可獲知此信息。應該在作為搜索起點的祖先節(jié)點上調(diào)用contains()方法,并為該方法傳遞一個參數(shù),即要檢測的后代節(jié)點。如果傳人的節(jié)點是當前節(jié)點的 后代,那么方法返回true;否則返回false。來看下面的例子:
? ? ? ?alert(document.documentElement.contains(document.body>); //true
? ? ? ?這個例子測試
? ? ? ?Firefox不支持contains()方法,但Firefox在DOM3級實現(xiàn)中提供了一個替代的compareDocumentPosition()方法(Opera 9.5及更高版本也支持此方法)。這個方法用于確定兩個節(jié)點之間的關系,返回一個表示該關系的位掩碼( bitmask)。下表列出了這個位掩碼的值。?
? ? ? ?為模仿contains()方法,應該關注的是掩碼16??梢詫ompareDocumentPosition()的結(jié)果執(zhí)行按位與,以確定參考節(jié)點(調(diào)用compareDocumentPosition()方法的當前節(jié)點)是否包含給定的節(jié)點(傳人的節(jié)點)。來看下面的例子:
? ? ? ?var result=document.documentElement. compareDocumentPosition( document. body);
? ? ? ?alert(!!(result&16));
? ? ? ?執(zhí)行上面的代碼后,結(jié)果會變成20(表示“居后”的4加上表示“被包含”的16)。對掩碼16 執(zhí)行按位操作會返回一個非零數(shù)值,而兩個邏輯非操作符會將該數(shù)值轉(zhuǎn)換成布爾值。
? ? ? ?使用一些瀏覽器及能力檢測,就可以寫出如下所示的一個通用的contains()函數(shù):
? ? ? ?function contains( refNode, otherNode){
? ? ? ? ? ? ? if (typeof refNode. contains==”function”&&
? ? ? ? ? ? ? ? ? ? ?(! client. engine .webkit ff 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:
? ? ? ? ? ? ? }
? ? ? ?}
? ? ? ?這個函數(shù)使用了三種方法來確定一個節(jié)點是不是另一個節(jié)點的后代。函數(shù)的第一個參數(shù)是參考節(jié)點,第二個參數(shù)是要檢查的節(jié)點。在函數(shù)體內(nèi),首先檢測refNode中是否存在contains()方法(能力檢測)。這一部分代碼還檢查了當前瀏覽器所用的WebKit版本號。如果方法存在而且不是WebKit (! client.engine.webkit),則繼續(xù)執(zhí)行代碼。否則,如果瀏覽器是WebKit且至少是Safari 3 (WebKit版本號為522或更高),那么也可以繼續(xù)執(zhí)行代碼。在WebKit版本號小于522的Safari瀏覽器中, contains()方法不能正常使用。
? ? ? ?接下來檢查是否存在compareDoumentPosition()方法,而函數(shù)的最后一步則是自otherNode 開始向上遍歷DOM結(jié)構(gòu),遞歸地取得parentNode并檢查是否與refNode相等。在文檔樹的頂端, parentNode的值等于null,于是循環(huán)結(jié)束。這是針對舊版本Safari設計的一個后備策略。
? 本文僅限內(nèi)部技術人員學習交流,不得作于其他商業(yè)用途.希望此文對廣技人員有所幫助。原創(chuàng)文章出自:南昌網(wǎng)站建設公司-百恒網(wǎng)絡http://m.myforexfactory.net/如轉(zhuǎn)載請注明出處!