如何用JS获取多个P标签里的我选中的那个?并添加CSS样式?

JavaScript015

如何用JS获取多个P标签里的我选中的那个?并添加CSS样式?,第1张

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

<!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>

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

<h2>This is a heading</h2>

<p>This is a paragraph.</p>

<p>This is another paragraph.</p>

<button type="button">Click me</button>

<script>

//        页面加载

    window.onload = function(){

//        获取button按钮

        var obj = document.getElementsByTagName("button")

//        监听button按钮

        obj[0].onclick = function(){

//            获取P标签

            var oP = document.getElementsByTagName('p')

            for( var i = 0  i < oP.length  i++)

            {

//                修改P标签颜色

                oP[i].style.color = 'red'

            }

        }

    }

</script>