站长网_站长主页_站长之家_易采站长站

会员投稿 投稿指南 站长资讯通告: jQuery学习笔记之jQuery的DOM操作
搜索:
您的位置: 主页 > 教程 > 前端设计 > jQuery > » 正文

jQuery学习笔记之jQuery的DOM操作

来源: 易采站长站

一.节点的操作


1.查找节点:


var $var_1=$(“htmltype”);   //这句话就是获取所有htmltype节点


如:var $ul_1=$(“ul”);


 


2.创建并追加节点:


var $var_1=$(“<htmltype>”);//这句话是创建一个节点


$(“htmltype2”).append($var_1) ; //这句话是把节点插入所有htmltype2节点中


例子:var $li_1=$(“<li  title=”title1″>香蕉</li>”);


         $(“ul”).append($li_1);


 


其中插入方法有以下几种:

append() 把B追加到A内部(所有的A元素,以下类似)
appendTo() 把A追加到B内部
prepend() 把B追加到A内部的内容前
prependTo() 把A追加到B的内容前
after() 在A后追加B
insertAfter() 在A前追加B
before() 在A前追加B
insertBefore()在A后追加B

例子:$(“ul”).append(“<li>你好</li>”);//在ul内部追加li


         $(“<li>你好</li>”).appendTo(“ul”);//在ul内部追加li


 


3.删除节点

remove() 删除该元素
empty() 清空节点,包括后代节点

例子:$(“ul  li:eq[1]”).remove(); //获取ul中的第二个li并删除


        $(“ul  li”).remove(“li[title=”菠萝”]”);//删除ul中li元素属性title=”菠萝”的元素


 


4.复制节点

clone();//复制本节点

例子:$(“ul  li:eq[1]”).clone().appenTo(“ul”);//复制并追加到ul中,只复制是不会显示出来的


 


5.替换节点

replaceWith();//将B替换所有A
replaceAll();//将A替换所有B

6.包裹节点

warpAll();//用B包裹A
warpInner();//用B包裹A的内容

 


二.属性操作


1.获取和设置属性


var $var_1=$(“p”);//这句话是获取节点P


 var $p_1=$var_1.attr(“title”);//获取节点P的title属性


var $p_2=$var_1.attr(“title”,”你好”);//设置节点P的title属性为”你好”


  


2.删除属性


$(“p”).removeAttr(“title”);//删除节点P的Title属性


 


三.样式操作


1.获取和设置样式


var $var_class=$(“p”).attr(“class”);//获取节点P的class属性

最新图文资讯
1 2 3 4 5 6
易采站长站 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助 -