1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Document</title>
- </head>
- <body>
- <div id="div1">hello</div>
- <div class="content">word</div>
- <div class="content"> !!!</div>
- <ul id="ul1">
- <li>1</li>
- <li>2</li>
- <li>3</li>
- </ul>
- <ul id="ul2">
- <li>4</li>
- <li>5</li>
- <li>6</li>
- </ul>
- <script>
- // var div1 = document.getElementById('div1')
- // console.log(div1)
- // var content = document.getElementsByClassName('content')
- // console.log(content)
- // var div3 = document.getElementsByTagName('div')
- // console.log(div3)
- /*
- querySelector 获取元素
- 智能获取符合条件的一个元素
- */
- // var div1 = document.querySelector('#div1')
- // console.log(div1)
- // var div2 = document.querySelector('.content')
- // console.log(div2)
- // var div3 = document.querySelector('div')
- // console.log(div3)
- /* querySelectorAll 查找所有满足条件的元素 */
- /* nodeList 类数组 不是真正的数组 只具有少数数组的方法 */
- // var aLi = document.querySelectorAll('li')
- // console.log(aLi)
- // var a = [1,2,3]
- // console.log(a)
- // for(var i=0;i<aLi.length;i++){
- // aLi[i].onclick = function(){
- // console.log(this.innerText)
- // }
- // }
- var ul2 = document.querySelector('#ul2')
- console.log(ul2)
- var uli2 = ul2.querySelectorAll('li')
- console.log(uli2)
- </script>
- </body>
- </html>
|