1. 程式人生 > >統計頁面使用標簽種類數

統計頁面使用標簽種類數

arr 既然 nbsp 字母相同 bsp post del lin filter

之前在知乎上看到賀老(賀師俊)在一個問題下的回答裏一個問題激起了我的興趣,原鏈接如下

https://www.zhihu.com/question/22504189/answer/36812048 原問題是寫一個函數返回一個頁面裏共使用了多少種HTML tag。 這個問題乍一看好像挺復雜,剛開始以為需要遍歷DOM樹一個一個累加,但後來覺得這樣過於復雜(因為收集文檔所有元素對象是個問題),後來就由於搬家的緣故擱置了一段時間,再後來我在重新復習操作DOM方法的時候發現document.getElementsByTagName("*");可以解決上述收集文檔所有元素對象的問題,既然這樣那就好辦了,先用document.getElementsByTagName("*");收集所有元素對象(除<!DOCTYPE html>文檔信息標簽外)的HTMLCollection對象(記住,不是NodeList對象,《JavaScript權威指南》原書裏說錯了),這是一個類數組對象,可以遍歷每個元素對象將每個元素對象的標簽名推入另一個數組用來存放標簽名,這樣就收集到所有元素的標簽名了。 但另一個問題出現了:怎樣計算這個存放標簽名的數組裏究竟有多少種標簽名呢?只要計算出有多少種標簽名就對應知道有多少種HTML tag了。我當初想過將每個標簽名首字母相同的收集在一起成為一個數組:
//
tagNames數組用來存放標簽名 // array是存放首字母相同的標簽名的數組 var array=tagNames.filter(function(element){ return element.indexOf(theFirstLetter)===0?true:false; });

但同樣發現這樣不現實而且很麻煩,因為這樣還要比較第二個字母,第三個,第四個。。。。。。。。。。。。

後來我發現數組的sort()方法可以解決這個問題,因為sort()方法排序是按ASCII排序的,也就是說,標簽名相同的元素會排在一起,這樣只要排序後遍歷array數組,發現下一個標簽名不同就可以計數加一,相同的聚在一起就不加一,就OK了。我把我的思路寫在這裏:https://github.com/linweinb/JavaScript/blob/master/test/countNumberOfTagSort.html

統計頁面使用標簽種類數