getAll方法是私人的,在manipulation模組中。代碼只有簡單的幾行,如下
複製代碼 代碼如下:
function getAll( elem ) {
if ( typeof elem.getElementsByTagName !== "undefined" ) {
return elem.getElementsByTagName( "*" );
} else if ( typeof elem.querySelectorAll !== "undefined" ) {
return elem.querySelectorAll( "*" );
} else {
return [];
}
}
從函數名可知該方法用來擷取傳入HTML元素的所有子項目。內部就三個分支
1,先判斷elem是否有getElementsByTagName方法,如有使用getElementsByTagName方法擷取所有子項目後返回。
2,不支援getElementsByTagName接著判斷elem是否支援querySelectorAll方法,如支援使用querySelectorAll方法擷取元素子項目後返回。
3,getElementsByTagName和querySelectorAll都不支援,返回空數組。
當時看這段代碼時有的疑惑,感覺第二個分支有點多餘。
1,getElementsByTagName 是DOM Level 2 中的API(較早),目前的所有瀏覽器應該都已經支援,既然都支援了,那麼就不會進入第二個分支而直接返回了。後面代碼豈不是都是多餘了。
2,querySelectorAll 是DOM Level 3 中的API(較新),IE6/7不支援。
看到這裡大家是不是也覺得後面兩個分支是多餘的呢? 或者說能找出不多餘的理由嗎? 即只要找出符合以下條件的元素elem。
“elem沒有getElementsByTagName方法,但有querySelectorAll方法”
經過多方尋求,討論終於找到了答案(小牛同學發現的)。DocumentFragment滿足該條件。
複製代碼 代碼如下:
var frag = document.createDocumentFragment();
alert('getElementsByTagName' in frag);
alert('querySelectorAll' in frag);
以上代碼在IE9/Chrome/Safari/Firefox/Opera中先後彈出了false,true。
到此,不解釋了。
註:DocumentFragment對象的幾個特殊點
1,IE6/7/8中具有createElement方法,其它瀏覽器(IE9/10/Safari/Chrome/Firefox/Opera)沒有
2,IE9/10/Firefox/Safari/Chrome/Opera中沒有getElementsByTagName方法,但有querySelectorAll方法。
相關:
http://www.jb51.net/article/30352.htm
https://developer.mozilla.org/en/DOM/document.createDocumentFragment
https://developer.mozilla.org/En/DOM/DocumentFragment
http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-B63ED1A3