节点的插入之append()和appendTo()的用法介绍

 说到节点的插入想必大家对append()和appendTo()的用法并不陌生吧,下面有个不错的是,希望对大家学习有所帮助

代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>jquery</title> 
<script type="text/javascript" src="jquery-1.7.2.js"></script> 
<script type="text/javascript"> 
$(function(){ 
//append()的用法 
//$("ul").append("<li title='abc'>hello</li>"); 
//$("ul").append("<li title='xyz'>world</li>"); 
//appendTo()的用法 
$("<li title='xyz'>hello</li>").appendTo($("ul")); 
}); 
</script> 
</head> 
<body> 
<p title="hello world">您认为圣思园培训好不好呢?</p> 
<ul> 
<li title="1">好</li> 
<li title="2">很好</li> 
<li title="3">非常好</li> 
<li title="4">特别好</li> 
<li title="5">太好了</li> 
<li title="6">好的无法描述了</li> 
</ul> 
</body> 
 
</html> 
 
在已有的节点上操作 
代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>jquery4</title> 
<script type="text/javascript" src="jquery-1.7.2.js"></script> 
<script type="text/javascript"> 
$(function(){ 
var li1 = $("<li title='abc'>hello</li>"); 
var li2 = $("<li title='abc'>world</li>"); 
var li3 = $("<li title='abc'>hello world</li>"); 
$("ul").append(li1); 
$("ul").prepend(li2); 
$("ul li:eq(4)").after(li3); 
 
}); 
</script> 
</head> 
<body> 
<p title="hello world">您认为圣思园培训好不好呢?</p> 
<ul> 
<li title="1">好</li> 
<li title="2">很好</li> 
<li title="3">非常好</li> 
<li title="4">特别好</li> 
<li title="5">太好了</li> 
<li title="6">好的无法描述了</li> 
</ul> 
</body> 
</html> 
 

时间: 2024-08-02 20:16:42

节点的插入之append()和appendTo()的用法介绍的相关文章

节点的插入之append()和appendTo()的用法介绍_jquery

复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"

jquery中append()与appendto()用法分析_jquery

本文实例分析了jquery中append()与appendto()的用法.分享给大家供大家参考.具体分析如下: 在jQuery的文档操作方法中,append()和appentto()方法执行的任务相同,但是两者也有区别. 1.append()方法:在被选元素的结尾(但仍在元素内部)插入指定的内容. a.语法: 复制代码 代码如下: $(selector).append(content);其中,参数content是必需的,指定要附加的内容. b.append能够使用函数给被选元素附加内容,语法为:

append和appendTo的区别以及appendChild用法

 很多新手朋友们对append和appendTo的区别以及js中的appendChild用法有所模糊,下面就举例为大家详细介绍下,感兴趣的朋友不要错过 append()前面是要选择的对象,后面是要在对象内插入的元素内容  appendTo()前面是要插入的元素内容且为Jquery对象,而后面是要选择的对象    实例:  $('#a').append('content');  $('<div>content</div>').appendTo($('#a'));    注意appen

append和appendTo的区别以及appendChild用法_jquery

append()前面是要选择的对象,后面是要在对象内插入的元素内容 appendTo()前面是要插入的元素内容且为Jquery对象,而后面是要选择的对象 实例: $('#a').append('content'); $('<div>content</div>').appendTo($('#a')); 注意appendTo前面一定要是Jquery对象. appendChild(Node)这个 方法一般是在指定元素节点的最后一个子节点之后添加节点 但如果Node是页面中的DOM对象,那

《jQuery、jQuery UI及jQuery Mobile技巧与示例》——3.6 技巧:使用append()和appendTo()添加内容

3.6 技巧:使用append()和appendTo()添加内容 html()方法会替换元素的当前内容,因此将由你负责维护当前元素的内容.代码清单3-6演示了如何使用append()和appendTo()添加元素而不影响元素的当前内容. 代码清单3-6 演示append()和appendTo()之间的区别 00 <!DOCTYPE html> 01 02 <html lang="en"> 03 <head> 04 <title>Diffe

jQuery中appendTo()方法用法实例_jquery

本文实例讲述了jQuery中appendTo()方法用法.分享给大家供大家参考.具体分析如下: 此方法把匹配的元素插入指定元素结尾,插入位置在元素的内部. appendTo()方法的作用和append()方法是相同的,但是语法是不同的,尽管形式一样. 语法结构: 复制代码 代码如下: $(selector).appendTo(content) 参数列表: 参数 描述 selector 要被插入的匹配元素. content 要被插入匹配元素的元素. 实例代码: 复制代码 代码如下: <!DOCTY

dom复制cloneNode节点与插入节点appendChild()

2, 复制节点. cloneNode(boolean) : 它有一个参数. var mes = document.createTextNode("hello world"); var container = document.createElement("p"); container.appendChild(mes); document.body.appendChild(container); var newpara = container.cloneNode(tr

linux中vi命令之文本插入操作(append,insert,open)

: 1. 插入(Insert) 命令 vi 提供了两个插入命令:i 和I. (1) . i 命令插入文本从光标所在位置前开始, 并且插入过程中可以使用键删除错误的输入.此时vi 处于插入状态,屏幕最下行显示"–INSERT–" 插入字样. (2) . I 命令 该命令是将光标移到当前行的行首, 然后在其前插入文本. 2. 附加(append) 命令 vi 提供了两个附加插入命令:a 和A. (1) . a 命令该命令用于在光标当前所在位置之后追加新文本, 新输入的文本放在光标之后,在光

节点光端机在高速公路监控系统中的应用介绍

一.高速公路监控系统前景展望自1988年中国第一条高速公路--全长15.9公里的沪嘉高速公路建成通车以来,中国高速公路建设开始向世界前列高速发展,截止2008年年底全国高速公路通车总里程达到6.03万公里,居世界第二位,仅去年一年就新修通高速公路6433公里.按照2005年公布的高速公路网发展规划,中国正在全力以赴地加快国家高速公路网主骨架建设,到2020年,基本建成国家高速公路网,届时,中国高速公路通车总里程将达10万公里,对安防厂商和工程商来说这无疑蕴含着具大的商机. 中国高速公路监控系统从