jQuery parent.append和$after的区别

首先假设我们有个id为test的div和一个id为test2的div：

<div id="test">

我是测试div

</div>

<div id="test2">

我是test2！

</div>

append是在指定元素内部比如：

$("#test").append("<div>测试文字</div>");

执行结果：

<div id="test">

我是测试div

<div>测试文字</div>

</div>

<div id="test2">

我是test2！

</div>

而after则是在指定元素外部且紧挨着：

$("#test").after("<div>测试文字</div>");

执行结果：

<div id="test">

我是测试div

</div>

<div>测试文字</div>

<div id="test2">

我是test2！

</div>

其实就是一个在元素内部生成和元素外部生成的区别。

时间： 2024-10-27 13:43:11

jQuery parent.append和$after的区别的相关文章

JQuery之append和appendTo的区别，还有js中的appendChild用法

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

jquery中append与appendTo方法区别

1. append(content)方法方法作用:向每个匹配的元素内部追加内容. 参数介绍:content (<Content>): 要追加到目标中的内容. 用法示例: HTML代码为<p>I come from </p><p>I love </p> 向所有p标签中追加一个单词china,则写法为 $("p").append("china"); 结果为:<p>I come from chin

jquery parent()和parents()区别

parent(exp) 取得一个包含着所有匹配元素的唯一父元素的元素集合. 你可以使用可选的表达式来筛选. 查找段落的父元素中每个类名为selected的父元素. HTML 代码: <div><p>Hello</p></div><div class="selected"><p>Hello Again</p></div> jQuery 代码: $("p").parent(&

append和appendTo的区别以及appendChild用法 (一个是js中，另两个是jquery中)

append和appendTo的区别以及appendChild用法作者: 字体:[增加减小] 类型:转载很多新手朋友们对append和appendTo的区别以及js中的appendChild用法有所模糊,下面就举例为大家详细介绍下,感兴趣的朋友不要错过 append()前面是要选择的对象,后面是要在对象内插入的元素内容 appendTo()前面是要插入的元素内容且为Jquery对象,而后面是要选择的对象实例: $('#a').append('content'); $('<div>con

jquery中append、prepend, before和after方法的区别（一）

原文:http://blog.csdn.net/woosido123/article/details/64439490 在 jquery中append() 与 prepend()是在元素内插入内容(该内容变成该元素的子元素或节点),after() 与before()是在元素的外面插入内容(其内容变成元素的兄弟节点). 1. append()和prepend() <div class='a'> <div class='b'>b</div> </div> 1 2

转：jQ函数after、append、appendTo的区别

1.after函数定义和用法:after() 方法在被选元素后插入指定的内容.参考:http://keleyi.com/a/bjac/cfyxd60g.htm语法:$(selector).after(content)实例效果体验:http://keleyi.com/keleyi/phtml/jquery/13.htm实例代码: <html> <head> <title>jquery的after函数实例-柯乐义</title><base target=&

JQuery之JQuery的版本 JQuery入门属性获取 JQuery就绪函数 JS文档就绪函数和JQuery文档就绪函数的区别 JS对象和JQuery对象的区别关于$的使用多个JS库的冲突解决方案

JQuery的版本 JQuery入门属性获取 JQuery就绪函数 JS文档就绪函数和JQuery文档就绪函数的区别 JS对象和JQuery对象的区别关于$的使用多个JS库的冲突解决方案 JQuery的版本 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jQuery的版本</title> <

用Jquery动态append方式加入标签时Css样式丢失的解决方法

一般在Jquery中会用下面的方式来添加新标签: var obj = "<fieldset data-role='controlgroup' data-type='vertical' data-role='fieldcontain'> <input id='menu0" type='checkbox'/><label for='menu0'> 复选框 </label> </fieldset>"; //按个人要求拼接

jquery clone 与 clone(true) 的区别

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <script src="jquery-1.4.3.js" type="text/javascript"></script> <s