获取外部css的元素

html文件

<html>
    <head>
        <link href="mycss.css" rel="stylesheet" type="text/css">
        <script language="javascript" type="text/javascript">
            function test4(event){
                //获取第一个样式表,也就是my.css中所有class选择器都获取
                var ocssRules=document.styleSheets[0].rules;//获取的是css集合中的第一个
                //从ocssRules中取出你希望的class,也就是mycss文件中第一个规则
                var style1=ocssRules[0];
                if(event.value=="黑色"){
                style1.style.backgroundColor="black";
            }else if(event.value=="红色"){
                style1.style.backgroundColor="red";
                }
                }
</script>
<head>
<body>  
    <div id="div1" class="style1">div1</div>
<input type="button" value="黑色" onclick="test4(this)"/>
<input type="button" value="红色" onclick="test4(this)"/>
</body>
</html>

mycss文件

.style1{
width:300px;
height:200px;
background-color:pink;
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值