jqueryを使用してdivにタグを追加できますか?-フロントエンドQ&A-php.cn

jqueryを使用してdivにタグを追加できますか?

青灯夜游

リリース： 2023-01-28 16:34:33

オリジナル

2122 人が閲覧しました

jquery を使用して div にタグを追加できます。 4 つの方法: 1. append() を使用して div 要素の末尾にサブタグを挿入します (構文は "$("div").append(element)" です; 2. prepend() を使用してサブタグを挿入しますdiv 要素の先頭に -tag、構文 "$("div").prepend(element)"; 3. appendTo() を使用して div 要素の末尾にサブタグを挿入します; 4. prependTo() を使用しますdiv 要素の先頭にサブタグを挿入します。

jqueryを使用してdivにタグを追加できますか?

このチュートリアルの動作環境: Windows7 システム、jquery3.6 バージョン、Dell G3 コンピューター。

jquery を使って div にタグを追加する方法は 4 つあります:

append() メソッド: 選択した要素内の「末尾」にコンテンツを挿入します。
prepend() メソッド: 選択した要素内の「先頭」にコンテンツを挿入します。
appendTo() メソッド: 指定したコンテンツを選択した要素の末尾に挿入します (ただし要素の内部にあります)。ただし、関数を使用してコンテンツを追加することはできません。
prependTo() メソッド: 指定されたコンテンツを選択した要素の先頭に挿入します (ただし要素の内部にあります)。

#ノードを追加する Jquery メソッド

この簡単な例を使って説明しましょう

1. メソッドを追加します

<body>
    <div>我是里面的div</div>
    <p>我是外面p</p>
</body>

<script>
    $(function(){
        $("div").append($("p"));//添加到元素内容的后面
    })
</script>

ログイン後にコピー

## 2. メソッドを先頭に追加します

<body>
    <div>我是里面的div</div>
    <p>我是外面p</p>
</body>

<script>
    $(function(){
        $("div").prepend($("p"));//添加到元素内容的前面

    })
</script>

ログイン後にコピー

3. appendTo メソッド

<body>
    <div>我是里面的div</div>
    <p>我是外面p</p>
</body>

<script>
    $(function(){
        $("p").appendTo($("div"));//子元素添加到父元素里,并且添加到父元素内容的后面面
    
    })
</script>

ログイン後にコピー

4. prependTo メソッド

<body>
    <div>我是里面的div</div>
    <p>我是外面p</p>
</body>

<script>
    $(function(){
       $("p").prependTo($("div"));//子元素添加到父元素里,并且添加到父元素内容的前面
    
    })
</script>

ログイン後にコピー

【推奨学習: