jq或者js通过div的id获取里面所有p标签class为title的内容

JavaScript023

jq或者js通过div的id获取里面所有p标签class为title的内容,第1张

<!doctype html>

<html>

<head>

   <meta charset="utf-8">

   <title>获取内容</title>

</head>

<body>

   <div id="test">

       <p class="title">1111</p>

       <p class="content">10101010</p>

       <p class="title">222</p>

       <p class="content">20202020</p>

       <p class="title">333</p>

       <p class="content">30303030</p>

   </div>

   <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>

   <script>

       var array = $('#test').find('p.title').map(function (index, ele) {

           return ele.innerHTML

       }).get()

       console.log(array)

   </script>

</body>

</html>

使用jquery 获取相应的元素非常简便。

// 获取第一个p标签

const firstP = $('p:first')

// 获取最后一个p标签

const lastP = $('p:last')

console.log(firstP, lastP)

这个其实不难，主要是获取当前的标签，并添加样式，然后给其他的标签的样式设为无就可以了代码如下：

<!doctype html>

<html>

<head>

<title>js获取二级菜单p元素</title>

<style>

.ps{width:100px height:45px background:#fc0 color:#000}

</style>

<script>

window.onload=function(){

    var spans=document.getElementById("qm-p")//获取span标签，这样方便下一步获

    取二级菜单

         

     var menuP=spans.getElementsByTagName("p")//通过getElementsByTagName标签获

     取p标签

     

     for(i=0i<menuP.lengthi++){  //遍历二级菜单

     menuP[i].onclick=function(){

       

      for(j=0j<menuP.lengthj++){

              menuP[j].className="" //给其他标签样式设为无            

}  

   this.className="ps"//给当前标签添加样式

}

        

 

}

 

}

</script>

</head>

<body>

<li ><a href="javascript:" id="mine-qm" >启蒙</a>

<span id="qm-p">

<p>爱的世界</p>

<p>中文启蒙</p>

<p>美猴王汉语·幼儿</p>

</span>

</li>

</body>

</html>

希望可以帮到你，还有什么疑问随时追问