JS中利用this指针改变背景颜色

 <li class="com" id="0" onClick="chosen(this)"><img src="images/com.png" class="iocn"></li>
    <li class="com" id="1" onClick="chosen(this)"><img src="images/com.png" class="iocn"></li>
    <li class="com" id="2" onClick="chosen(this)"><img src="images/com.png" class="iocn"></li>
    <li class="com" id="3" onClick="chosen(this)"><img src="images/com.png" class="iocn"></li>
    <li class="com" id="4" onClick="chosen(this)"><img src="images/com.png" class="iocn"></li>
 function chosen(){
        this.style.backgroundColor="blue";
    }

如果形参忘记传了,你可以直接用arguments获取,但是你要确定你的参数是第几个,如题直接arguments[0]就可以了。你在调用函数时传的this指的是点击的那个元素,而你在chosen函数中用的this指的是window对象,所以不能直接this.style.backgroundColor="blue";

function chosen(){
   arguments[0].style.backgroundColor="blue";
}
 function chosen(el){
        el.style.backgroundColor="blue";//不要用this,this是window对象,用参数el。 而且style的属性是区分大小写的
    }

你这样弹框都弹不出来,页面的chosen方法传了一个参数,但是你写的函数没给参数,所以函数根本没执行,给个参数就好了。

你的响应方法中有传递参数this了直接在js方法中设置参数,不要使用关键字,如下

  function chosen(obj){
        obj.style.backgroundColor="blue";
    }
    <style>
        .red{background:red;}
    </style>
    <script>
    function chosen(obj){
        //建议使用class控制样式
        $(obj).addClass('red');
        //如果需要点击this,其他取消样式
        $(obj).siblings('li').removeClass('red');
    }
    </script>