首页 > 代码库 > 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 after() 方法在被选元素之后插入内容。
jQuery before() 方法在被选元素之前插入内容。
实例
复制代码代码如下:
$("img").after("Some text after");
$("img").before("Some text before");
下面脚本之家小编给补充一下
append() 方法在被选元素的结尾插入内容。
prepend() 方法在被选元素的开头插入内容。
after() 方法在被选元素之后插入内容。
before() 方法在被选元素之前插入内容。
演示代码:
?
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | <script type= "text/javascript" src=http://www.mamicode.com/ "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> |
运行后效果图:
html结构图
jquery append、prepend、before等等
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。