回忆:
对象的获取:
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 :写一个值是赋值 不写是取值