大橙子网站建设,新征程启航
为企业提供网站建设、域名注册、服务器等服务
titlejQuery插入,复制、替换和删除节点/title
10年积累的网站制作、网站建设经验,可以快速应对客户对网站的新想法和需求。提供各种问题对应的解决方案。让选择我们的客户得到更好、更有力的网络服务。我虽然不认识你,你也不认识我。但先网站策划后付款的网站建设流程,更有武威免费网站建设让你可以放心的选择与我们合作。
script type="text/javascript" src="jquery-1.3.2.js"/script
script type="text/javascript"
$(document).ready(function(){//几种添加节点的方法//$("p").append("b你好吗?/b");//向p元素中追加《b》//$("b你好吗?/b").appendTo("p");//将《b》追加到p元素中//$("p").prepend("b你好吗?/b");//向p中前置《b》//$("b你好吗?/b").prependTo("p");//将《b》前置到p元素中//$("p").after("b你好吗?/b");//向p元素后插入《b》//$("b你好吗?/b").insertAfter("p");//将《b》插入到p元素后边//$("p").before("b你好吗?/b");//在p元素之前添加《b》//$("b你好吗?/b").insertBefore("p");//将《b》插入到p元素前面//几种删除节点的方法//var $li=$("ul li:eq(1)").remove();//删除ul节点中第2个元素节点//$("ul").append($li);//把刚删除的元素节点从新添加到ul元素中去//$("ul li").remove("li[title!=菠萝]");//将ul元素下title属性不等于"菠萝"的li元素删除//$("ul li:eq(1)").empty();//清空ul节点下第2个li元素的内容//复制节点/*$("ul li").click(function(){
$(this).clone(true).appendTo("ul");//复制当前点击的节点,并将它追加到《ul》元素中,当添加参数时复制它的事件});*///替换节点//$("p").replaceWith("strong你最不喜欢的水果是?/Strong");});/script/headbodyp你好!/p
你最喜欢的水果是?ulli title="苹果"苹果/li
复制的时候加个参数:true
即:.clone(true)
.clone(
[
withDataAndEvents
],
[
deepWithDataAndEvents
]
)
withDataAndEvents一个Boolean值(true
或者
false)指示事件处理函数是否会被复制。对已jQuery
1.4,元素数据也会被复制。
默认值是
f...
复制的时候加个参数:true
即:.clone(true)
.clone(
[
withDataAndEvents
],
[
deepWithDataAndEvents
]
)
withDataAndEvents一个Boolean值(true
或者
false)指示事件处理函数是否会被复制。对已jQuery
1.4,元素数据也会被复制。
默认值是
false。*对于1.5.0的默认值是true
。这将在1.5.1以上改回false。
deepWithDataAndEvents一个布尔值,指示是否对事件处理程序和克隆的元素的所有子元素的数据应该被复制。默认情况下它的值相匹配的第一个参数的值(
默认值是
false)
$('.'+classname).next('.addframe').append('br' + $('.'+classname).html());
$('.'+classname).next('.addframe').find( '.'+classname).empty();
试试
jquery复制的节点怎么改变样式,如下通过一个例子来说明:
例子代码:
!DOCTYPE html
html
head
script src="/jquery/jquery-1.11.1.min.js"/script
script
function myFunction()
{
$("#h01").html("Hello jQuery");
$("ul li").click(function(){
$(this).clone(true).appendTo("ul").attr("id","cloneli");
//复制当前点击的节点,并将它追加到《ul》元素中,当添加参数时复制它的事件
$("#cloneli").text("是li2").css("background","red");
});
}
$(document).ready(myFunction);
/script
/head
body
h1 id="h01"/h1
div id='test_div'
ul
li 是li1/li
/ul
div
/body
/html
其中: $(this).clone(true).appendTo("ul").attr("id","cloneli");是jQuery的复制,在复制添加到ul标签里后,在给该复制的li加上一个id,id标明该li标签唯一,通过该标签可操作修改其样式。
$("#cloneli")即是复制标签的操作对象,可以调用jQuery其他方法可修改样式,如下修改背景颜色。
$("#cloneli").text("是li2").css("background","red");
当点击“是li1”,复制添加到li1下面,红色背景li2(在点击事件中已修改)
动态创建Dom节点
jQuery中使用$(html字符串)来动态创建Dom节点,并且返回一个jQuery对象,可以调用append等方法将创建的节点添加到Dom中。
例如:
var
link
=
$("a
href=''百度/a");
$("div:first").append(link);
添加节点元素的方法:
Append方法用来在元素的末尾追加元素(最后一个子节点)
Prepend在元素的开始添加元素(第一个子节点)
After:在元素之后添加元素(添加兄弟节点)
Before:在元素之前添加元素(添加兄弟节点)
子元素.appendTo(父元素):在元素的末尾追加一个子元素
子元素.prependTo(父元素):在元素的开始追加一个子元素
A.insertBefore(B)
将A插入到B的前面,等同于B.before(A);
X.insertAfter(B)
将X插入到Y的后面,等同于Y.after(X);
删除节点:
Empty():清空该元素下的所有子节点
等同于:while(ele.firstChild){ele.removeChild(ele.firstChild);}
Remove(selectot);自杀;删除当前元素,返回值为被删除的元素,可以讲节点删除之后放到其他节点下面,有一个移动的效果,例如:
var
lis
=
$("#ulSite
li").remove();
$("#ulSite2").append(lis);
Clone()克隆节点,支复制节点,不复制节点
Clone(true):克隆节点带事件
节点的替换:
$("br").replaceWith("hr/");
$("br").replaceAll("hr/");
包裹节点
Wrap()方法用来将所有的元素逐个用指定的标签包裹
$("b").wrap("font
color='red'/font");将所有粗体字红色显示
wrapInner();在内部围绕