JQuery概念：

JQuery是一个框架，用原生JavaScript代码封装成一个函数库，可根据需求使用相应语法调用；（类似于Java类中封装方法）

JQuery的导入：

直接在html文件的head部分添加（<script src="js/jquery.min.js"></script>），需写在最前面否则在自定义JS文件中会找不到jQuery；

jQuery选择器概述：

选择器是jQuery的核心，且jQuery选择器与css选择器语法类似；

id选择器：$( "# ID名 " )；

类选择器：$( ". 类名 " )；

元素选择器：$( " 元素名 " )；

组选择器：$( " 元素名，. 类名，# ID名 。。。" )；

后代选择器：$( " 父元素名 子元素名 " )；

子选择器：$( " 父元素名 > 子元素名 " )；

选择指定父元素下的指定子元素

第一个子元素：后代选择器：$( " 父元素名 子元素名：first " )；

最后一个子元素：后代选择器：$( " 父元素名 子元素名：last " )；

not 选择器（多用于复选框）

选中选择器：$( " 元素名：（checked） " )；

未选中选择器：$( " 元素名：not（：checked） " )；

偶数选择器：$( " 父元素名 子元素名：even" )；

奇数选择器：$( " 父元素名 子元素名：odd" )；

eq选择器：$( " 父元素名 子元素名：eq（索引）" )；<选择指定索引元素>

gt选择器：$( " 父元素名 子元素名：gt（索引）" )；<选择大于指定索引的元素>

 

JavaScript文件中事件绑定方式：

$(function(){

$("button").click(function() {

alert("JavaScript第一种绑定方式")

});

})

$(function(){

$("button").click(method);

})

function method(){

alert("JavaScript第二种绑定方式")

}

HTML文件中事件绑定方式：

<script >

$(function(){

$("button").click(function() {

alert("HTML第一种绑定方式")

});

})

</script>

<script >

$(function(){

$("button").click(method);

})

function method(){

alert("HTML第二种绑定方式")

}

</script>

多元素绑定同一事件案例

$(function(){

$("button").click(removeById);

})

//定义删除函数

function removeById(){

//弹窗确认是否删除

var flag=window.confirm("是否删除数据");

//返回值为false直接结束函数

if (!flag) {

return ;

};

//获取需要删除数据的编号

//$(this)：表示触发函数的元素

//$(this).parents("tr")：获取该元素的父类元素

//$(this).parents("tr").find("td:eq(0)")：根据父类元素查询对应编号所在的元素

//$(this).parents("tr").find("td:eq(0)").text()：获取元素内部文本内容

var empno = $(this).parents("tr").find("td:eq(0)").text();

var parentTr=$(this).parents("tr");

$(this).parents("tr").fadeOut('slow', function() {

//移除已被删除的元素

parentTr.remove();

console.log($("tr").length);

});