js修改css

Question

本帖最后由 cooc123 于 2011-06-02 11:19:42 编辑

Answer 1

var lastObj;//如果有默认设置为current的话，这里搞个默认值
function change=function(obj){
obj.className="current";
if(lastObj!=undefined) lastObj.parentNode.className="";
lastObj=obj;
}
 <li onclick="change(this)"><a href="/"><span>0</span></a></li>
        <li onclick="change(this)"><a href="1"><span>1</span></a></li>
        <li onclick="change(this)"><a href="2"><span>2</span></a></li>
        <li onclick="change(this)"><a href="3"><span>3</span></a></li>
        <li onclick="change(this)" class="current"><a href="4"><span>4</span></a></li>

Answer 2

呃，写错了
lastObj.parentNode.className="";这个要把parentNode.去掉，手误

Answer 3

<li><a href="javascript:void(0);"><span>0</span></a></li>
        <li><a href="javascript:void(0);"><span>1</span></a></li>
        <li><a href="javascript:void(0);"><span>2</span></a></li>
        <li><a href="javascript:void(0);"><span>3</span></a></li>
        <li class="current"><a href="javascript:void(0);"><span>4</span></a></li><script type="text/javascript">
$("span").bind('click',function(){
$("li").each(function(i)
{
$("li").eq(i).removeClass("current");
});
$(this).closest("li").addClass("current");
});
</script>

Answer 4

<style type="text/css">.current{border:1px solid #ccc;color:#000;padding:5px;background:#efefef;}</style>
<ul id="nav">
<li><a href="#"><span>0</span></a></li>
    <li><a href="#"><span>1</span></a></li>
    <li><a href="#"><span>2</span></a></li>
    <li><a href="#"><span>3</span></a></li>
    <li class="current"><a href="#"><span>4</span></a></li>
</ul>
<script type="text/javascript">
var navs = document.getElementById('nav').getElementsByTagName('li');
var tmp = navs[navs.length-1];
for(var i=0; i<navs.length; i++){
navs[i].onclick = function(){
tmp.className = '';
this.className = 'current';
tmp = this;
}
}
</script>

Answer 5

jQuery:$('li').click(function(){
    $(this).addClass('current');
    $(this).siblings().removeClass('current');
});