- 💂 个人主页:爱吃豆的土豆
- 💬 如果文章对你有帮助、欢迎关注、点赞、收藏(一键三连)和订阅专栏哦
- 🏆人必有所执，方能有所成！
- 🌈欢迎加入社区，福利多多哦！土豆社区
- 🐋希望大家多多支持😘一起进步呀！
目录
jQuery：数组遍历【阶段重点】
jQuery：事件
jQuery：数组遍历【阶段重点】
<script>
$(function(){
var arr = ['a','b','c','d'];
//js普通FOR循环遍历
for(var i=0;i<arr.length;i++){
console.log("索引："+i+" 元素："+arr[i]);
}
console.log("-----");
//Jquery循环遍历1
$(arr).each(function (index) {
console.log("索引："+index+" 元素："+this);
});
console.log("-----");
//Jquery循环遍历2
$.each($(arr),function (index) {
console.log("索引："+index+" 元素："+this);
});
});
</script> |
建议使用第一种。
格式2：
function(index,n){
//index 为当前遍历的索引，从0开始
//n 就是this，为当前遍历出来的元素，这个元素是JS对象
}
jQuery：事件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#d1{
background-color: #87CEFA;
width:300px;
height:300px;
}
#d2{
background-color:bisque;
width:300px;
height:300px;
}
</style>
<script src="../js/jquery-3.3.1.min.js"></script>
<script>
$(function(){
//页面加载完成时，
//为d1加入鼠标移入和点击事件
$("#d1").mouseover(function () {
//修改内容体为红色字体
$(this).html("<font color='red'>我是div1</font>");
}).click(function () {
alert(this.innerHTML);
});
//为d2加入鼠标移出事件
$("#d2").mouseout(function () {
alert(this.innerHTML);
});
});
</script>
</head>
<body>
<div id="d1">我是div1</div>
<div id="d2">我是div2</div>
</body>
</html>
|
jq对象.事件1().事件2();
