IE9 之前的瀏覽器缺乏強大的querySelectorAll() 方法,當你需要根據屬性檢索元素時會遇到困難具體屬性。為了解決這個問題,讓我們來探索一個適用於 IE7 及更高版本的本機解決方案。
我們可以利用 getElementsByTagName 方法來模擬 querySelectorAll 的功能。讓我們建立一個名為 getAllElementsWithAttribute 的函數來尋找具有特定屬性的元素:
<code class="js">function getAllElementsWithAttribute(attribute) { var matchingElements = []; var allElements = document.getElementsByTagName('*'); for (var i = 0, n = allElements.length; i < n; i++) { if (allElements[i].getAttribute(attribute) !== null) { // Element has the attribute. Add it to the array. matchingElements.push(allElements[i]); } } return matchingElements; }</code>
此函數將屬性名稱作為參數並迭代文件中的所有元素。對於每個元素,它會檢查指定的屬性是否存在且不為空。如果是,則將該元素新增至符合元素的陣列。
要擷取具有data-foo 屬性的所有元素,只需呼叫:
<code class="js">getAllElementsWithAttribute('data-foo');</code>
此方法提供了在缺少querySelectorAll 的瀏覽器中透過屬性檢索元素的本機解決方案,確保與IE7 及更高版本的兼容性。
以上是如何在 Pre-querySelectorAll 瀏覽器中按屬性檢索元素?的詳細內容。更多資訊請關注PHP中文網其他相關文章!