jQuery选择器、元素属性操作--jQuery基础知识点(1)

一、jQuery代码风格：

1. $(document).ready(function(){})可简写为$(function(){})其在页面框架下载完毕后就执行;而window.onload=function(){}必须在页面全部加在完毕（包含图片下载）后才能执行。很明显前者的执行效率高于后者。
2. 在jQuery选择器定位页面元素时，无须考虑定位元素在页面中是否存在，即使不存在，浏览器也不会报错！

二、jQuery选择器：

1. 基本选择器：效率： $("#id") > $("element") > $(".class") > $("*")
2. 层次选择器：例：$("div span") 例：$("#divMid").siblings("div")
3. 过滤选择器：例：$("#select option:selected")  $("li:nth-child(2)")
（1）简单过滤选择器【:first、:last、:not、:even、:odd、:eq、:gt、:lt、:header、:animated】
（2）内容过滤选择器【:contains、:empty、:has、:parent】
（3）可见性过滤选择器【:hidden、:visible】
（4）属性过滤选择器【[attribute=value]、[attribute!(^,$,*)=value]】
（5）子元素过滤选择器【:nth-child(eq|even|odd|index)、:first-child、:last-child、:noly-child】
（6）表单对象属性过滤选择器【:enabled、:disabled、:checked、:selected】
4. 表单选择器：例：$("#form1 :input") 例：$("#form1 :password")

三、 jQuery元素属性操作：

1. DOM(Document Object Model，文档对象模型)
2. 通过该函数返回的值作为元素的属性
    attr(key,function(index))
    例：$("img").attr("src",function(){ 
         return "Images/img0" + Math.floor(Math.random()*2+1)+".jpg"
            }); 
3. $("select").val().join(","); //获取列表框中全部被选中的选项值
    $(":radio").val(["radio2","radio3"]); //value值为radio2和radio3的单选框被选中
4. toggleClass(class); //元素中含有名称为class的CSS类别时，删除该类别，否则增加一个该名称的CSS类别
5. 动态创建节点：$(html)
    var $div = $("<div title="jQuery学习">加油</div>");
    $("body").append($div);
    等价于：$($div).appendTo($("body"));
6. clone()&clone(true)
    clone()被复制后的元素以不具有任何元素的行为
7. replaceWith(content)&replaceAll(selector)
    $("#id").repalceWith("<span>ligang</span>"); //后者替换前者
    $("<span>ligang</span>").replaceAll("#id"); //前者替换后者
8. wrap()&wrapInner()
    $("p").wrap("<b></b>"); //包裹在p标签外<b><p></p></b>
    $("span").wrapInner("<i></i>"); //span内的内容被i标签包裹<span><i></i></span>
9. $("img").each(function(index){})  //index下标从0开始
10. remove()&empty()
      empty(); //只移除了指定元素中的所有子节点
      remove([expr]); //把其从dom中删除，而不会保留其所占的位置
      <p>Hello</p>
     $("p").empty(); //结果：Hello
     $("p").remove(); //结果：p标签也被删除