JS獲取元素

1.   document.getElementsByTagName('標簽名')     //通過標簽名獲取多個元素  返回一個偽數組

<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>

var res=document.getElementsByTagName('div')
console.log(res)

2.  document.getElementById('id名')   通過id獲取元素，返回對應的元素

<div id="box">哈哈</div>

var res=document.getElementById('box')
console.log(res)

3.通過元素調用   .getElementsByTagName('標簽名') 

<div id="box">
  <div>1</div>
  <div>2</div>
</div>
var box=document.getElementById('box')
var res=box.getElementsByTagName('div')
console.log(res)

4. document.getElementsByClassName("類名")     //通過類名獲取多個元素  返回一個偽數組

var res=document.getElementsByClassName("box")
console.log(res)

5.通過元素調用  .getElementsByClassName("類名")

<div id="app">
<div class="box">1</div>
<div class="box">2</div>
</div>

var app=document.getElementById('app')
var res=app.getElementsByClassName("box")
console.log(res)

6.document.querySelector('.選擇器')    //通過選擇器查找元素，返回符合條件的第一個

var res=document.querySelector('.box')
console.log(res)

  document.querySelectorAll('選擇器')    // 通過選擇器查找元素，返回一個偽數組

var res=document.querySelectorAll('.box')
console.log(res)