复习之JQuery基本语法（二）——事件及函数

最新推荐文章于 2024-08-27 13:38:21 发布

IManiy

最新推荐文章于 2024-08-27 13:38:21 发布

阅读量221

点赞数

分类专栏：前端文章标签： jQuery

本文链接：https://blog.youkuaiyun.com/IManiy/article/details/82919782

版权

前端专栏收录该内容

31 篇文章

订阅专栏

$(function(){})

表示文档结构已经加载完成后执行js代码

//$(function(){})其实是$(document).ready(function(){}) 的简写
$(document).ready(function(){
  $("button").click(function(){
   
  });
});

$.each

JQuery遍历函数

//两种写法
//第一种
//mydata数据源
//index - 选择器的 index 位置
//element - 当前的元素（也可使用 "this" 选择器）
$.each(mydata,function(index,element){
 });

$(selector).each(function(index,element))

parent() 父元素

parent() 方法返回被选元素的直接父元素。
该方法只会向上一级对 DOM 树进行遍历。
下面的例子返回每个 span 元素的的直接父元素：

$("span").parent();

JQuery选择、过滤

：过滤符

//选择id为select1 中的option  过滤条件为被选择
$("#select1 option:selected")
//选择id为form-control3的除去第一个的所有option 执行删除操作
 $("#form-control3 option:not(:first)").remove();

append()添加

//表格添加一行
$("table").append("<tr><td>"+user.username+"</td></tr>");

第二种形式

var $option=$("<option></option>");
                        $option.val(ablum.albumId);
                        $option.text(ablum.albumName);
                        $("#select1").append($option);

click()点击事件

$("button").click(function(){
$("img").hide()
})

change事件

$("#select1").change(function () {
}

为元素添加事件

 $('div').on('click',function (event) {
            //event.stopPropagation(); //阻止冒泡
            console.log('click div')
        })

为元素移除事件

//移除事件
        $('div').off('click mouseover');