jQuery2_事件绑定+DOM操作

回忆：

对象的获取：

1：$(“选择器”)—当前页，根据选择器能获取多少就获取多少

2:当前对象.过滤函数或者查找函数——找和当前对象有关的对象——第一个 兄弟 孩子 父亲等等…

jquery对象——一个对象但是其中封装了一个就是数组。

——操作都是函数：

val():取值是区第一个 val(值)：赋值：给选中的所有标签全部都赋值

html()

text()

addClass：class属性值： class=“a” class=“a b”

removeClass

css：行内样式

prop：简化属性

attr(“属性名”):取值 attr(“属性名”,属性值)：赋值——常规属性和自定义

事件绑定：

jquery对象.事件名(functijon(){

})–jquery对象能选中多少html标签就可以给多少做绑定

– 动态生成的做绑定

jqueyr对象.on(“事件名”,“传递给那个选择器”,function(){})

当对象的事件发生的时候，判定是不是传递的那个选择器的触发的，如果是执行function，如果不是不执行

如果第二个参数：直接将事件绑定了指定的对象——跟第一种没区别

节点操作：

创建：$(html)

追加：append

删除：empty remove

复制：clone—— clone（true）

JSON：非常重要:固定格式的字符串，各个平台之间交互一般都是他

{“属性”：属性值,…}

---

一. 本章内容

jQuery各种事件

jQuery事件绑定

jQuery属性操作

DOM节点操作

二. 内容

2.1 jquery事件

/* window.οnlοad=function(){}--页面加载完毕之后会触发onload事件 */
//ready：页面渲染完毕之后执行——onload只能书写一个  ready可以写多个
$(document).ready(function(){
    $("#regBtn").click(function(){
    	console.log(1);
    })
})
$().ready(function(){
    $("input").blur(function(){
    	$(this).css("backgroundColor","red")
    });
})
$(function(){
    $("input").focus(function(){
    	$(this).css("backgroundColor","green")
    });
})

2.2 事件绑定的两种形式

2.2.1 对象.事件名

jquery的event对象的属性：

$("#regBtn").click(function(e){//js的e和jquery的e有些属性是不一样的，基本都没差别
	console.log(1);
	console.log(e.pageX);
	console.log(e.pageY);
})

2.2.2 on事件绑定

$(selector).on(event,【childSelector,data】,function)

$("input").on("blur",function(){
	$(this).css("backgroundColor","red")
})
父亲.on("事件名","传递给那个选择器"，function(){})

2.2.3****jQuery合成事件

hover：鼠标悬浮和离开

//hover单独写是一个悬浮事件
//写两个：悬浮调用第一个  移开调用第二个
$("#regForm").hover(function(){
	$(this).css("backgroundColor","yellow")
},function(){
	$(this).css("backgroundColor","blue")
})

2.2.4 jQuery属性操作

– css:操作行内css属性的 html：innerHTML val：value attr：操作属性

– prop: attr

html text val :写一个值是赋值 不写是取值

attr prop css：写一个是取值 写两个是赋值

remove：只是删除用的

/* $("#chackAll").attr("checked","checked") */
$("#chackAll").click(function(){
      //js的写法
      //console.log(this.checked)
      //attr针对的属性和属性值：常规状态下type name ——attr可以操作常规属性/不操作简化属性
      //attr如果针对的是