document拿到的是整個html頁面,之后element對標簽進行選擇拿取,少用id多用class
<body>
<div class="div1">
<p class="p1">hello 1 p</p>
<p class="p1">hello 2 p</p>
<div class="div2"></div>
</div>
<script>
//document拿到的是整個html頁面,之后element對標簽進行選擇拿取
//
var ele=document.getElementsByClassName("p1")[1];//當class相同但多個內容不同的標簽存在時,可以用數組進行取值,可以查看到結果是hello 2 p
console.log(ele)
</script>
<body>
<div class="div1">
<p class="p1">hello 1 p</p>
<p class="p1">hello 2 p</p>
<div class="div2">hello div
<div>div3</div>
<a href="">click</a>
</div>
</div>
<script>
var ele1=document.getElementsByClassName("p1")[0];
console.log(ele1.parentElement) // 兄弟:sibling
var ele=document.getElementsByClassName("div1")[0];
console.log(ele.children)//children是屬性,js主要用屬性,jquery主要是用方法
</script>
<body>
<div class="div1">
<p name="littleP" class="p1">hello 1 p</p>
<div class="div2">hello div
<div>div3</div>
<a href="">click</a>
</div>
</div>
<script>
var ele=document.getElementsByName("littleP")[0];//通過name拿標簽,不加數組不行
var ele1=ele.nextElementSibling;//拿到p標簽下的div2了
console.log(ele1.innerText)//獲取div2以下所有文本內容,innertext
</script>