用JavaScript给所有相同的class添加CSS样式。

用JavaScript给所有相同的class添加CSS样式。,第1张

<!doctype html>

<html lang="en">

 <head>

  <meta charset="UTF-8">

  <meta name="Generator" content="EditPlus®">

  <meta name="Author" content="">

  <meta name="Keywords" content="">

  <meta name="Description" content="">

  <title>Document</title>

 </head>

 <body>

 <div id="container" style="width: 480px height: 220pxborder:1px solid #e3e3e3" onclick="renderLink()">

    <a href="#" class="mya">Test1</a>

    <a href="#">Test2</a>

    <a href="#" class="mya">Test3</a>

    <a href="#" class="mya">Test4</a>

    <a href="#" class="mya">Test5</a>

    <a href="#">Test6</a>

 </div>

 </body>

</html>

<script type="text/javascript">

    function renderLink(){

        var alist = document.getElementsByClassName("mya")

        if(alist){

            for(var idx = 0 idx < alist.length idx ++){

                var mya = alist[idx]

                mya.style.color = "red"

                mya.style.fontSize = "36px"

            }

        }

    }

  </script>

先用document.getElementsByClassName("className")取得所有class为className的元素,再循环添加样式即可,如果用JQuery会简单很多;也可以自己用JS封装一个函数实现JQuery一样的效果

js不可修改css中的属性,只能为指定的class的元素添加内联样式(style)

原生JS:

var dom = document.getElementsByClassName('dtd')

for(var i=0,len=dom.lengthi<leni++){

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

}Jquery

$('.dtd').css({color:'red'})


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/bake/11901885.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-19
下一篇 2023-05-19

发表评论

登录后才能评论

评论列表(0条)

保存