JQuery

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);
});