jQuery中append(),prepend()与after(),before()的区别

经过 jQuery,能够很容易地添加新元素/内容。app

添加新的 HTML 内容

一共有四种方法:spa

  • append() - 在被选元素的结尾插入内容
  • prepend() - 在被选元素的开头插入内容
  • after() - 在被选元素以后插入内容
  • before() - 在被选元素以前插入内容

如下为jQuery中append(),prepend()与after(),before()四个方法的区别3d

一、jQuery append () 方法blog

    jQuery append() 方法在被选元素的结尾插入内容。方法

    例如:im

加以前:db

加以后:img

原始:<p>This is a paragraph.</p>dba

append加完以后:<p>This is a paragraph. <b>Appended text</b></p>标签

 append 新加内容在原内容 P标签里面后面

二、jQuery prepend() 方法

    jQuery prepend() 方法在被选元素的开头插入内容。

    例如:

加以前:

加以后:

 

原始:<p>This is a paragraph.</p>

prepend 加完以后:<p> <b>Prepend text</b> This is a paragraph. </p>

prepend 新加内容在原内容 P标签里面前面

三、jQuery after() 方法

    jQuery after() 方法在被选元素以后插入内容。

    例如:

加以前:

加以后:

 

原始:<p>This is a paragraph.</p>

after加完以后:<p> This is a paragraph. </p> <b>After</b>

after新加内容在原内容 P标签外面的后面

 

四、jQuery before () 方法

    jQuery before() 方法在被选元素以前插入内容。

    例如:

    $("p").before("<b>Before</b>");

其代码结构为:

加以前:

加以后:

 

原始:<p>This is a paragraph.</p>

before加完以后:<b>Before</b><p> This is a paragraph. </p> 

before新加内容在原内容 P标签外面的前面

好啦,这下记住啦,before after在外面加,append prepend 在里面加!

相关文章
相关标签/搜索