jquery事件

来源：互联网发布：mac上传图片编辑：程序博客网时间：2024/05/23 12:31

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">

</style>
</head>
<body>
<div >来啊来啊~点我啊</div>
<div >来啊来啊~点我啊1</div><div >来啊来啊~点我啊2</div>
</body>
<script src="js/jquery-3.2.1.min.js" ></script>
<script type="text/javascript">
console.log($('div')[0]);
//jq对象中的第一个元素是原生的js节点(元素)
//如果有几个元素前几个就分别是原生的js节点
//把jq对象看做一个数组例如：有三个div 那么数组的前三个对象就是你的三个div，后面是jq封装的方法
$('div')[0].onclick=function(){
alert('你还真点我!');
}
//JQ绑定事件 on('事件名'，function(){执行的代码});
//jquery自动有循环绑定效果
//jquery 中的$(this) 相当与原生的方法中的this
//.index获取索引
//.eq(索引) 获取相应的jq对象
$('div').on('click',function(){
$('div').css({'backgroundColor':'white'});
$(this).css({'backgroundColor':'yellow'});
console.log($(this).index());
});
//清除事件.off()
//$('div').off('mouseover');

</script>
</html>

阅读全文

0 0