web-dev-qa-db-ja.com

特定の位置にリスト項目を追加する方法

特定の位置に<li>を追加したい、例えば：

<ul id="list">
    <li>Position 1</li>
    <li>Position 2</li>
    <li>Position 4</li>
<ul>

新しい<li>を<li>Position 2</li>の下/後に追加したいとしましょう。jQueryを使用してどうすればよいですか？

私は以下のコードを使用してそれをやろうとしました：

$('#list li:eq(1)').append('<li>Position 3</li>');

しかし、<li>内に<li>Position 2</li>を追加し、代わりに<li>の下/後に<li>Position 2</li>を追加するため、機能しませんでした。

誰か助けてもらえますか？

ありがとうございました。

jqueryappendlistitem
41
Germanico Brismal

after()の代わりに append() を使用する必要があります。

説明：一致した要素のセットの各要素の後に、パラメータで指定されたコンテンツを挿入します。

_$('#list li:eq(1)').after('<li>Position 3</li>');
_

append()のドキュメントには次のように明記されています。

コンテンツ（...）を各要素の末尾に挿入します。

完全を期すために：

:eq(n)は一致する要素セットのnth要素に一致し、 :nth-child(n) はnthの子要素に一致することに注意してください。親。

73
Felix Kling

after()またはinsertAfter()を使用する必要があります
http://api.jquery.com/category/manipulation/dom-insertion-outside/

8
emmanuel
$('<option val="position3">Position3</option>').insertAfter('#list :nth-child(<give childnumber here>)')

1から始まるインデックス

3
jay

チェックinsertAfterhere

1
Teja Kantamneni