Jquery 学习笔记《锋利的jquery》
一行代码解决导航栏的功能$(".level1>a").click(function(){$(this).addClass("current") //给当前元素添加"current"样式
.next().show() //下一个元素显示
.parent().sibing().children("a").removeClass("current") //父元素的同辈元素的子元素移除"current"样式
.next().hide();
return false; //下一级隐藏
})链式操作代码规范
1.对于同一个对象操作不超过3个操作的，可以直接写成一行
2.对于同一个对象操作比较多，建议一行一个操作
3.对于多个对象的少量操作，可以每个对象写一行，如果涉及子元素，可以适当考虑缩进
约定定义jquery和dom变量的风格
1.如果获取的是jquery对象，在变量前面加$
var $variable=jquery对象
1.如果获取的是dom对象，
var variable=dom对象
jquery对象和dom对象的转换
query对象转dom对象[index]和get(index)
1.var $cr=$("#cr"); //jquery对象
var cr=$cr[0]; //dom对象
2.var $cr=$("#cr"); //jquery对象
var cr =$cr.get(0); //dom对象
dom对象转jquery $()
var cr=document.getElementById("cr"); //dom对象
var $(cr)=$(cr); //jquery对象
检查某个元素在网页上是否存在
jquery 在使用的时候不用检查是否存在，即使不存在也不会报错，js如果不存在直接用，浏览器会报错
js
test
jquery
错误写法 if($("#tt")){.........}
正确写法 if($("#tt").length>0){.........}
或 if($("#tt")[0]){.........}选择器中的一些注意事项
1.选择器中含有"." ,"#" ,"(", "[" 等特殊字符
解决方法是在前面只用转义符转义//
2.选择器中含有空格的注意事项
var $t=%(".test :hidden"); //有空格的 表示选取class为test的元素里面的隐藏元素
var $t=%(".test:hidden"); //没空格的 表示选取隐藏class为test的元素
toggle()
$toggleBn.toggle(function(){
//显示元素
}，function(){
//隐藏元素
})
节点操作补充
append()和after()区别
append()：向每个匹配元素内部追加内容
after()：向每个匹配元素之后追加内容（外部）
appendTo()方法也可以用来移动元素，移动元素收i按从文档中删除此元素，然后将该元素插入得到的文档的指定节点
$(this).clone().appendTo()复制当前的节点，并将它追加到元素中，但被复制的新元素不具有任何行为，clone(true)则复制元素同时也复制绑定元素的行为
删除节点
1.remove():该节点的所有后代节点都同时删除，返回值是一个指向已经被删除的节点的引用，因此可以在以后再使用该元素
2.detach():与remove不同，所有的绑定事件，附加的数据都会保留下来
3.empty()：不是删除节点，它能清空节点的所有后代节点
toggleClass()控制样式上的重复切换，如果类名存在则删除，不存在则添加用法与toggle同
focus()相当于js的onfocus() blur()js的onblur()
$("#address").focus(function(){
var text=$(this).val();
if (text==" 请输入邮箱地址"){
$(this).val("");
}
})$("#address").blur(function(){
var text=$(this).val();
if (text==" "){
$(this).val("请输入邮箱地址");
}
})defaultValue属性包含该表单元素的初始值
val()
val()不仅能设置元素的值，同时获取元素的值，还可以使select chexkbox radio 的相应的选项被选中 注attr()也可以
children()只考虑子元素不考虑后代元素
事件冒泡
事件冒泡解决方法
$("element").bind("click",function(event){
event.stopPropagation(); //停止事件冒泡
})
//网页中的元素有自己默认的行为，例如，单击超链接后会跳转，单击提交后表单会提交，有时候需要阻止元素的行为，将上面的停止事件冒泡改为阻止默认行为，即event.preventDefault() 用attr()还是prop()
使用prop()方法来获取属性，返回值是标准的属性true/false 比如$("#checkbox").prop('disable'),不会返回“disable”或“ ”，只会返回true/false。当然赋值的时候也是如此，这样，便统一了所有的操作。无论是从语法上还是语义上
哪些属性用attr() 哪些用prop()
1.只添加属性名称该属性就会生效应该使用prop()
2.只存在true/false的属性应该用prop()
class=require
在表单中class属性为“required”的文本框是必须填写的，因此需要将它与其他非必需填写的表单元素加以区别，即在文本框后面追加一个红色的小星星标识，可以用append()方法来完成
$("form :input.required").each(function(){
var $require =$("*");//创建元素
$(this).parent().append($required);//添加到文档
})
$.each()
$.each()函数不同于jquery对象的each()方法，它是一个全局函数，不操作jquery对象，而是以一个数组或对象作为第一个参数，以一个回调函数作为第二个参数，回调函数拥有两个参数，第一个为对象的成员或数组的索引，第二个为对应变量或内容，在$.each()函数中，如果需要退出each循环，只需要返回false即可