jquery append与appendTo方法比较

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 china</p><p>I love china </p>

2. appendTo(expr)方法

方法作用：把所有匹配的元素追加到指定的元素元素集合中。

参数介绍：expr (String): 用于匹配元素的jQuery表达式。

用法示例：

HTML代码为<b>I love china </b><p></p>

把标签b追加到p元素中，写法为$("b").appendTo("p");

结果为：><p><b>I love china </b></p>

使用appendTo这个方法是颠倒了常规的$(A).append(B)的操作，即不是把B追加到A中，而是把A追加到B中。

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！

赞 (0)

相关推荐

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

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

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

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

  • jquery append与appendTo方法比较

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

  • jquery append()方法与html()方法的区别及使用介绍

    append(content):方法在被选元素的结尾(仍然在内部)插入指定内容,有很多朋友觉得append与html差不多,其它从英文意义上append是在原有基础上增加,而html中是替换当前所有内容. 定义和用法 append() 方法在被选元素的结尾(仍然在内部)插入指定内容. $(selector).append(content) 使用函数来附加内容 使用函数在指定元素的结尾插入内容. 语法 $(selector).append(function(index,html)) 实例代码: <

  • jQuery 追加元素的方法如append、prepend、before

    jQuery 追加元素的方法如append、prepend、before

    1.jQuery append() 方法 jQuery append() 方法在被选元素的结尾插入内容. 实例 $("p").append("Some appended text."); 2.jQuery prepend() 方法 jQuery prepend() 方法在被选元素的开头插入内容. 实例 $("p").prepend("Some prepended text."); 3.after() 和 before() 方法

  • jQuery打字效果实现方法(附demo源码下载)

    jQuery打字效果实现方法(附demo源码下载)

    本文实例讲述了jQuery打字效果实现方法.分享给大家供大家参考,具体如下: 运行效果截图如下: 点击此处查看在线演示效果. 1.前台页面代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3

  • jquery操作select常见方法大全【7种情况】

    本文实例讲述了jquery操作select常见方法.分享给大家供大家参考,具体如下: 在前段HTML页面设计中select 下拉框,或者 在 multiple="multiple" 时,表现为列表.经常会在页面上对其进行操作,这些操作不外乎: 1. 得到选中的 select 的 option 的值或者text. 2. 删除选中的 select 的 option. 3. 向select中增加新的option. 4. 得到select option 长度,也就是个数size 5. 清空se

  • jQuery遮罩层实现方法实例详解(附遮罩层插件)

    本文实例分析了jQuery遮罩层实现方法.分享给大家供大家参考,具体如下: 1 背景半透明遮罩层样式 需要一个黑色(当然也可以其他)背景,且须设置为绝对定位,以下是项目中用到的css样式: /* 半透明的遮罩层 */ #overlay { background: #000; filter: alpha(opacity=50); /* IE的透明度 */ opacity: 0.5; /* 透明度 */ display: none; position: absolute; top: 0px; lef

  • JQuery解析XML的方法小结

    本文实例总结了JQuery解析XML的方法.分享给大家供大家参考,具体如下: 用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做.下面我们来总结几个使用JQuery解析XML的例子. 第一种方案: <script type="text/javascript"> $(document).ready(function() { $.ajax({ url: 'http://localhost/cgi/test.xml', dat

  • jQuery get和post 方法传值注意事项

    刚刚做了几个实验,看看下面的代码就清楚了: 以下内容需要回复才能看到 jquery_data.php 复制代码 代码如下: <?php echo "post: "; print_r($_POST); echo "get: "; print_r($_GET); ?> jquery_test.html 实验1: 复制代码 代码如下: $(function() { // post 方法,两处都有数据 $.post('jquery_data.php?v1=1',

随机推荐