一、jquery 对class属性的操作
1、.addClass(“class1″) .removeClass(“class2″) 2、.attr(“className”,”class1″) 3、.toggleClass(“class1″)如果原来没有class1就添加class1,如果原来有class1就移除class
二、交互帮助方法 mouseover, mouseout ,hover( over, out )
1.<ul>有3个<li>,鼠标移入li的时候这个li的背景色变一下,已出背景色恢复
$('ul li').mouseover(function(){ $(this).css("backgroundColor","red"); }).mouseout(function(){ $(this).css("backgroundColor",""); }); 或者: $('ul li'").hover(function(){$(this).css('background-color','red');}, function(){$(this).css('background-color','green');});
对此方法的封装:
function _each(obj,className){ $(obj).each(function(n,value){ $($(obj)[n]).mouseover(function(){$(this).addClass(className)}).mouseout(function(){$(this).removeClass(className)}); }); }
2.jquery 点击某行变换背景颜色,其他行还原为原来颜色
$('.ztree ul li').each(function(index){ $('.ztree ul li ').click(function(){ $(this).css('background-color', 'red').siblings().css("background",""); }); }); 或者: $('.ul li ').click(function(){ $(this).css('background-color', 'red').siblings().css("background",""); ; });