18 of 119 menu

beforeメソッド

beforeメソッドは、指定した要素の前にテキストを追加します。 同様の動作をするinsertBeforeメソッドもあります。

構文

要素の前にテキストを挿入する:

$(セレクタ).before(テキスト);

ユーザー定義関数によって返されたテキストが、 選択された要素の前に次のように追加されます:

$(セレクタ).before(function(セット内のインデックス));

関数を使用する別の方法として、 第2引数には要素の古いhtml値が渡されます:

$(セレクタ).before(function(セット内のインデックス, html文字列));

テキストは単なるプレーンテキストだけでなく、 DOM要素やjQueryオブジェクトにもできます。 この場合、それらの要素はHTMLコード内の元の位置から移動されます。

指定された段落の前にテキストを挿入してみましょう:

<p id="test">text</p> $('#test').before('!!!');

HTMLコードは次のようになります:

!!!<p id="test">text</p>

指定された段落の前にタグ付きのテキストを挿入してみましょう:

<p id="test">text</p> $('#test').before('<p>!!!</p>');

HTMLコードは次のようになります:

<p>!!!</p><p id="test">text</p>

ある段落を別の段落の上に配置してみましょう (つまり、段落を古い位置から切り取り、新しい位置に配置します):

<p id="p1">text1</p> <p id="p2">text2</p> $('#p2').before('#p1');

HTMLコードは次のようになります:

<p id="p2">text2</p> <p id="p1">text1</p>

関連項目

  • metod insertBefore,
    指定した要素の前にテキストを追加します
  • metodi after, append, prepend,
    ページの特定の場所にコンテンツを追加できます
  • metod clone,
    選択された要素のコピーを作成します
日本語
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItalianoქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
当サイトでは、サイトの動作、分析、パーソナライゼーションのためにクッキーを使用しています。 データ処理はプライバシーポリシーに従って行われます。
すべて受け入れる 設定 拒否