dom :document、element,如何取父標簽和子標簽,innertext獲取標簽內容


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>

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM