1.3 jQuery基础

Posted 2020-08-26 曹智炫

使用jQuery需要引用jQuery文件（页面引用多个js文件时jQuery在最前面）

<script src="jquery-1.11.2.min.js"></script>


 

“$”符号是代表选择器

<script type="text/javascript">

    $(document).ready(function(e) {

　　　　function是匿名函数，e是形参

        });

</script>

 

JS中的找元素,DOM对象

var a = document.getElementById("");  根据id找

alert();

 

var a = document.getElementsByClassName("");  根据class名找

alert();

 

var a = document.getElementsByTagName("");   根据标签找

 

var a = document.getElementsByName("");   根据name找

 

jQuery：

var a = $("#aa");   根据ID找（#）

var a = $(".bb");  根据class名找（.）

var a = $("div");  根据标签名找（标签名称）

var a = $("[name=‘cc‘]");  根据属性找（属性名称）

 

jQuery操作属性：

a.attr("","");（设置）

 

alert(a.attr(""));（获取）

 

a.removeAttr("");（移除）

 

jQuery事件：

单个添加：

<input type="button" value="测试"  id= "btn"/>

 

$("#btn").click(function(){ 


　　　　alert("czx");

　　});　　　　会显示czx

 

多个添加：

<input type="button" value="测试1"  class= "btn"/>

<input type="button" value="测试2"  class= "btn"/>

<input type="button" value="测试3"  class= "btn"/>

 

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

　　　　//alert("czx111");   

　　　　alert($(this).val());  

    });  　　　　通过class名找到要修改的元素，谁触发的它，this就代表谁

 

挂事件：

<input type="button" value="挂事件"  id= "gua"/>

<input type="button" value="测试事件"  id= "ceshi"/>

<input type="button" value="移除事件"  id= "yichu"/>

 

点击给测试事件按钮挂一个事件
$("#gua").click(function(){       （bind绑定方法用于挂事件）
$("#ceshi").bind("click",function(){
alert("挂上了事件");
});
});

 

点击给测试事件按钮移除点击事件
$("#yichu").click(function(){　　　　（unbind方法（解绑的事件名称））
$("#ceshi").unbind("click");
})

});