Jquery

记录一下jquery比较常用的几个操作

1、js和jquery对象的转换

js转jquery:var jqueryOjb=$(jsObj);

jquery转js:var jsObj=jqueryObj[0];

2、属性选择器

1、id/class选择器。
2、自定义属性选择器

$(“input[name=’ch’][value='zhongguo']”)    获取name为ch，value为zhongguo的input元素。

$("input[name='hot']:checked").val(); 获取一组单选钮的选中值。

3、index选择器

$mytr.find("li:eq(0)")    获取选中的第0个元素。

3、属性/css设置获取

1、常规属性

属性设置：$(“selector”).attr("attribute");   

属性获取：$(“selector”).attr("attribute","mydefine");    

移除属性：$(“selector”).attr("attribute","")/[removeAttr("attribute")](http://www.w3school.com.cn/jquery/attributes_removeattr.asp);

value属性:val();

2、css属性

获取指定css属性：$("p").css("background-color");

设置指定css属性：$("p").css("background-color","yellow");

获取多个css属性：$("p").css();

设置多个css属性：$("p").css({"background-color":"yellow","font-size":"200%"});

4、同胞后代

parent() 方法返回被选元素的直接父元素
parents() 方法返回被选元素的所有祖先元素，它一路向上直到文档的根元素html

children() 方法返回被选元素的所有直接子元素。

find() 方法返回被选元素的后代元素，一路向下直到最后一个后代。

    eg:$("div").find(".app")    返回div所有后代中class为app的元素。

siblings() 方法返回被选元素的所有同胞元素。

next() 返回被选元素的下一个同胞元素。

nextAll() 方法返回被选元素的所有跟随的同胞元素。

prev(), prevAll() 

5、DOM操作

创建节点：var $li=$("<li>我是新建的节点</li>");

创建了节点之后，就可以利用jquery的方法对节点进行操作了,通常会使用find()进行特定节点的属性操作。

插入节点：

    $("ul").append($li) 向每个匹配的元素内部后置内容

    $("ul").prepend($li) 向每个匹配的元素内部前置内容

    $("ul").after($li) 在每个匹配元素之后插入内容 

    $("ul").before($li) 在每个元素之前插入内容 

删除节点：remove()

    eg:$(“ul li”).remove(“[title != test]”)；//将li中title不等于a的元素节点删除

节点复制：clone() 

节点文本：html()

6、循环遍历

$().each:往往针对DOM操作：

$(“input[name=’ch’]”).each(
    function(i){
        console.log($(this).attr(“checked”))
    }
);

$.each():往往针对数组对象的遍历：

$.each([{“name”:”limeng”,”email”:”xfjylimeng”},{“name”:”hehe”,”email”:”xfjylimeng”}],
    function(i,n){
        alert(“索引:”+i,”对应值为：”+n.name);
    }
);