jQuery 语法:
美元符号定义 jQuery:$ ;
$(document).ready(function(){ (jQuery入口函数)
$(function(){ // 开始写 jQuery 代码... });
开始写 jQuery 代码...
});
简洁写法:(与以上写法效果相同) (jQuery入口函数)
$(function(){
开始写 jQuery 代码...
});
window.onload = function (){ (JAVA入口函数)
执行代码...
}
jQuery 的元素选择器:
在页面中选取所有 <p> 元素: 用户点击按钮后,所有 <p> 元素都隐藏 【hide(隐藏属性)】
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
id 选择器:
$("#test")
$(document).ready(function(){
$("button").click(function(){
$("#test").hide();
});
});
.class 选择器:
$(".test")
$(document).ready(function(){
$("button").click(function(){
$(".test").hide();
});
});
“*” 选取所有元素:
$(document).ready(function(){
$("button").click(function(){
$("*").hide();
});
});
$(this) 选取当前 HTML 元素:
$(document).ready(function(){
$("button").click(function(){
$(this).hide();
});
});
jQuery 事件方法语法:
点击事件:$("p").click();
$("p").click(function(){
动作触发后执行的代码!!
});
单击P元素消失:
$("p").click(function(){
$(this).hide();
});
双击P元素消失:
$("p").dblclick(function(){
$(this).hide();
});
mouseenter( 鼠标移入:)
$("#p1").mouseenter(function(){
alert('您的鼠标移到了 id="p1" 的元素上!');
});
mouseleave( 鼠标移出:)
$("#p1").mouseleave(function(){
alert("再见,您的鼠标离开了该段落。");
});
hover( 当鼠标移动到元素上时,会触发指定的第一个函数(mouseenter);当鼠标移出这个元素时,会触发指定的第二个函数(mouseleave)。)
$("#p1").hover(function(){
alert("你进入了 p1!");
},
function(){
alert("拜拜! 现在你离开了 p1!");
}
);