源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

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

  • 时间:2020-08-07 06:46 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:jQuery 追加元素的方法如append、prepend、before
[b]1.jQuery append() 方法[/b] jQuery append() 方法在被选元素的结尾插入内容。 实例
$("p").append("Some appended text.");
[b]2.jQuery prepend() 方法[/b] jQuery prepend() 方法在被选元素的开头插入内容。 实例
$("p").prepend("Some prepended text."); 
[b]3、after() 和 before() 方法[/b] jQuery after() 方法在被选元素之后插入内容。 jQuery before() 方法在被选元素之前插入内容。 实例
$("img").after("Some text after"); 
$("img").before("Some text before"); 
[b]下面编程素材网小编给补充一下[/b] append() 方法在被选元素的结尾插入内容。 prepend() 方法在被选元素的开头插入内容。 after() 方法在被选元素之后插入内容。 before() 方法在被选元素之前插入内容。 演示代码:
<script type="text/javascript" src="http://common.jb51.net/jslib/jquery/jquery.min.js"></script>
<div class="testdiv">
 <ul>
  <li>第一个li标签</li>
 </ul>
</div>

<script>

 //append
 $('.testdiv ul').append('<li>append 插入的li</li>');
 //prepend
 $('.testdiv ul').prepend('<li>prepend 插入的li</li>');
 //after
 $('.testdiv ul').after('<li>after 插入的li</li>');
 //before
 $('.testdiv ul').before('<li>before 插入的li</li>');

</script>
运行后效果图: [img]http://files.jb51.net/file_images/article/201612/20161201235420.png[/img] html结构图 [img]http://files.jb51.net/file_images/article/201612/20161201235419.png[/img]
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部