background image

.mouseover(function(){alert(

‘mouse over event')}) 

.each(function(i){this.style.color=['#f00','#0f0','#00f'][ i ]}); 

8、操作元素的样式 
主要包括以下几种方式:

 

复制代码

 代码如下:

$(

“#msg”).css(“background”); //返回元素的背景颜色 

$(

“#msg”).css(“background”,”#ccc”) //设定元素背景为灰色 

$(

“#msg”).height(300); $(“#msg”).width(“200″); //设定宽高 

$(

“#msg”).css({  color:  “red”,  background:  “blue”  });// 以 名 值 对 的 形 式 设 定 样 式 

www.52mvc.com 
$(

“#msg”).addClass(“select”); //为元素增加名称为 select 的 class 

$(

“#msg”).removeClass(“select”); //删除元素名称为 select 的 class 

$(

“#msg”).toggleClass(“select”); //如果存在(不存在)就删除(添加)名称为 select 的 class 

9、完善的事件处理功能 
Jquery 已经为我们提供了各种事件处理方法,我们无需在 html 元素上直接写事件,而可以
直接为通过

jquery 获取的对象添加事件。 

如:

 

复制代码

 代码如下:

$(

“#msg”).click(function(){alert(“good”)}) //为元素添加了单击事件 

$(

“p”).click(function(i){this.style.color=['#f00','#0f0','#00f'][ i ]}) 

//为三个不同的 p 元素单击事件分别设定不同的处理 

jQuery 中几个自定义的事件: 

1)hover(fn1,fn2):一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方

法。当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数。当鼠标移出这个元素
时,会触发指定的第二个函数。

 

复制代码

 代码如下:

//当鼠标放在表格的某行上时将 class 置为 over,离开时置为 out。 
$(

“tr”).hover(function(){ 

$(this).addClass(

“over”); 

}, 
function(){ 
$(this).addClass(

“out”); 

}); 

2)ready(fn):当 DOM 载入就绪可以查询及操纵时绑定一个要执行的函数。 

复制代码

 代码如下:

$(document).ready(function(){alert(

“Load Success”)})