zoukankan      html  css  js  c++  java
  • jquery 插入节点的方法

     
    方法 描述 示例
    append() 向每个匹配的元素内部追加内容

    HTML代码:

    <p>我想说:</p>

    jQuery代码:

    $("p").append("<b>你好</b>")

    结果:

    <p>我想说:<b>你好</b></p>

    appendTo()

    将所有匹配的元素追加到指定的元素中。

    实际上,使用该方法是颠倒了常规的

    $(A).append(B)的操作,即不是将B追加到

    A中,而是将A追加到B中

    HTML代码:

    <p>我想说:</p>

    jQuery代码:

    $("<b>你好</b>").appendTo("p")

    结果:

    <p>我想说:<b>你好</b></p>

    prepend() 向每个匹配的元素内部前置内容

    HTML代码:

    <p>我想说:</p>

    jQuery代码:

    $("p").prepend("<b>你好</b>")

    结果:

    <p><b>你好</b>我想说:</p>

    prependTo()

    将所有匹配的元素前置到指定的元素中。

    实际上,使用该方法是颠倒了常规的

    $(A).prepend(B)的操作,即不是将B前置到

    A中,而是将A前置到B中

    HTML代码:

    <p>我想说:</p>

    jQuery代码:

    $("<b>你好</b>").prependTo("p")

    结果:

    <p><b>你好</b>我想说:</p>

    after() 在每个匹配的元素之后插入内容

    HTML代码:

    <p>我想说:</p>

    jQuery代码:

    $("p").after("<b>你好</b>")

    结果:

    <p>我想说:</p><b>你好</b>

    insertAfter()

    将所有匹配的元素插入到指定元素的后面。

    实际上,使用该方法是颠倒了常规的

    $(A).after(B)的操作,即不是将B插入到A

    后面,而是将A插入到B后面

    HTML代码:

    <p>我想说:</p>

    jQuery代码:

    $("<b>你好</b>").insertAfter("p")

    结果:

    <p>我想说:</p><b>你好</b>

    before() 在每个匹配的元素之前插入内容

    HTML代码:

    <p>我想说:</p>

    jQuery代码:

    $("p").before("<b>你好</b>")

    结果:

    <b>你好</b><p>我想说:</p>

    insertBefore()

    将所有匹配的元素插入到指定的元素的前面。

    实际上,使用该方法是颠倒了常规的

    $(A).before(B)的操作,即不是将B插入

    到A前面,而是将A插入到B前面

    HTML代码:

    <p>我想说:</p>

    jQuery代码:

    $("<b>你好</b>").insertBefore("p")

    结果:

    <b>你好</b><p>我想说:</p>

  • 相关阅读:
    状压DP【p1879】[USACO06NOV]玉米田Corn Fields
    Tarjan缩点+Spfa最长路【p3627】[APIO2009] 抢掠计划
    Tarjan缩点【p1726】上白泽慧音
    分层图【p4822】[BJWC2012]冻结
    Tarjan缩点+LCA【p2783】有机化学之神偶尔会做作弊
    线段树【p1607】[USACO09FEB]庙会班车Fair Shuttle
    better-scroll踩坑合集
    在浏览器上安装 Vue Devtools工具
    无法执行vue初始化命令
    vue-cli创建第一个项目(用git bash解决上下键移动选择问题)
  • 原文地址:https://www.cnblogs.com/xzzzys/p/8342733.html
Copyright © 2011-2022 走看看