javascript - 要取 指定索引的ul 里的 所有li 怎么取
問題描述
要取 指定索引的ul 里的 所有li 怎么取
我想這么寫var afterUl=document.querySelectorAll(’ul’)[sy-1];var afterLi=afterUl.querySelectorAll(’li’);但是下面的一行會報錯leilei.html:128 Uncaught TypeError: Cannot read property ’querySelectorAll’ of undefined。。。我應該怎么寫。。新手求助
問題解答
回答1:----- 06-03 14:50 -----
感謝 jasonintju 指出錯誤。
這里的報錯并不是因為沒有 querySelectorAll 方法,是由于題主的 下標 越界了,導致取到的 是 undefined,undefined 沒有 querySelectorAll 方法,故報錯。
正確的下標寫法是沒有問題的。
補充文檔Element.querySelectorAll() - Web APIs | MDN
----- 06-03 04:30 -----
leilei.html:128 Uncaught TypeError: Cannot read property ’querySelectorAll’ of undefined
報錯信息已經給你提示了,不能讀取querySelectorAll屬性,因為它是 undefined
原因是因為 querySelectorAll 是 document的方法,而不是 element的方法。
var afterUl = document.querySelectorAll(’ul’)[0];// document.querySelectorAll(’ul’) 通過 document 的方法 querySelectorAll 得到了當前文檔下的所有 ul 元素,是一個 NodeList 類數組。之后假設通過 [0] 取到了這個 NodeList 中的第一個元素,那么 afterUl 這個變量指向的是一個 DOM 元素,也就是 elementvar afterLi=afterUl.querySelectorAll(’li’);// 這時用 afterUl 也就是一個 element 調用 querySelectorAll,由于 element 下沒有 querySelectorAll 這個方法 自然就報錯了
解決方案是使用 getElementsByTagName
var oUl = document.getElementsByTagName(’ul’)[0];var aLi = oUl.getElementsByTagName(’li’);
可以參考一下 JavaScript 文檔中關于這兩個 API 的介紹
Document.querySelectorAll - Web API 接口 | MDNelement.getElementsByTagName - Web API 接口 | MDN
或者使用 jQuery 的
var aLi = $(’ul’).eq(0).find(’li’);回答2:
實現的方式很多,你可以采用原生JavaScript,也可以用各種js庫來實現。這里采用原生JavaScript整理一個思路,在ul的DOM元素上添加一個id屬性,通過document.getElementById取出ul,然后通過getElementsByTagName取出li元素。
代碼如下:
<ul id='ul-wrap'> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li></ul>var ul_wrap = document.getElementById(’ul-wrap’);var li_item = ul_wrap.getElementsByTagName(’li’);console.log(ul_wrap);console.log(li_item);回答3:
let oLis = document.getElementsByTagName('ul')[index].getElementsByTagName('li');
回答4:我自己找到錯誤了,是因為我后面的索引[sy-1]中變量sy的是之前遍歷所有li時候賦值的,因為所有li比所有ul多很多,所以[sy-1]超過了ul的個數,上面那行就會undefined 下面那行就報錯了。謝謝大家。。這問題太幼稚。。
相關文章:
1. 一個mysql聯表查詢的問題2. mysql - 一個表和多個表是多對多的關系,該怎么設計3. 運行python程序時出現“應用程序發生異常”的內存錯誤?4. html5 - iOS的webview加載出來的H5網頁,怎么修改html標簽select的樣式字體?5. python如何不改動文件的情況下修改文件的 修改日期6. javascript - git clone 下來的項目 想在本地運行 npm run install 報錯7. java - 我現在一個servlet中有調用socket訪問,作為socket的客戶端,8. 主從備份 - 跪求mysql 高可用主從方案9. mysql主從 - 請教下mysql 主動-被動模式的雙主配置 和 主從配置在應用上有什么區別?10. python 如何實現PHP替換圖片 鏈接
