css js 改变字体颜色

pl102029
  • 239

点击span后字体变成红色,移开后依旧保持红色怎么做。

回复
阅读 13.2k
7 个回答
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<span class="test">demo1</span>
<span class="test">demo2</span>
<span class="test">demo3</span>
<span class="test">demo4</span>
<script src="jquery.js"></script>
<script>

    // js版
    var aLi = document.querySelectorAll('.test');
    for (var i = 0; i < aLi.length; i++) {
        aLi[i].addEventListener('click', function(){
            this.style.color='red'
        });
    }

    // jquery版本
    $(".test").on('click', function(){
        $(this).css('color', 'red');
    });
    
</script>
</body>
</html>
<p onclick="this.style.color='#f00'">demo</p>
<span id="demo">点击变色</span>
//js
$("#demo").on("click",function(){
    $("#demo").css("color","red")
})    
小浅JJY
  • 1
新手上路,请多包涵
<span id="demo">点击变色</span>
//js
document.querySelector('#demo').onclick=function(){
    document.querySelector('#demo').style.color='red'
}; 

多个span用事件代理吧。

<div id="example">
  <span>1</span>
  <span>2</span>
  <span>3</span>
  <span>4</span>
</div>
var target = document.getElementById('example')
target.addEventListener('click', function(e) {e.target.style.color = 'red'})

添加一个class

clipboard.png

比较赞同楼上做法:$(span).on("click",function () {

$(this).addClass("red")

})

你知道吗?

宣传栏