搜索

首页  >  问答  >  正文

javascript - js赋值style元素内容

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

<code><head >

    <title></title>

    <style id="syle_id" type="text/css">

        .class1

        {

            color: Red;

        }

    </style>

    <script>

        function click_span() {

            document.getElementById("syle_id").innerHTML = ".class1{color:blue} ";

        }

    </script>

</head>

<body>

    <p>

        <span class="class1" onclick="click_span()">1</span>

    </p>

</body>

</code>

贴上源码，欲实现点击后样式发生改变 google是ok的，ie下报未知错误，求指点

阿神阿神2896 天前649

全部回复(2)我来回复

  • PHPz

    PHPz2017-04-10 12:50:59

    找到ie的赋值方式 document.getElementById("syle_id").styleSheet.cssText = ".class1{color:blue}"; 谷歌直接就innerhtml

    回复
    0
  • PHPz

    PHPz2017-04-10 12:50:59

    话说你为什么不直接用

    1

    2

    3

    4

    5

    <code>    function click_span() {

            var class1 = document.getElementsByClassName('class1');

            for(var i in class1) { class1[i].style.color = 'blue';

        }

    </code>

    而要用这么奇葩的方式？

    认真回答一下吧：一般碰上这种情况，都是预先将改变前和改变后的样式分别以两个class或者别的标记预先写到css中，使用的时候只要替换标记就好了，而不是你这种等到要用的时候现加。

    1

    2

    3

    4

    5

    6

    <code><style type="text/css">

        .class1 { color:red; }

        .class1.clicked { color:blue; }

    </style>

    <span class="class1" onclick="this.className += ' clicked'">1</span>

    </code>

    回复
    0
  • 取消回复