[jQuery]新しいノードを追加するときに、タグの属性も同時に指定する方法

2012年2月3日

jQueryでは、$( “<a />” )という表記で新しいDOMノードを作ることが出来ます。
上記の例では、アンカータグを生成します。

この際、第二引数にハッシュを指定することで、属性(attribute)も同時に指定可能です。

例：

var newLink = $( "<a />", { href: "http://www.yahoo.co.jp/", title: "yahoo", });
newLink.text( "yahooホームページ" );
 
$( "#links" ).append( newLink );



上記の例では、以下のタグを作り,id=”links”ノードの下に追加しています。

<a href="http://www.yahoo.co.jp/" title="yahoo">yahooホームページ</a>





また、keyがcssの項目を定義することで、スタイルの指定を行うことも出来ます。
(説明の為,途中で改行しています)

var newLink = $("<a />", { href: "http://www.yahoo.co.jp/", 
                           title: "yahoo",
                           css: { color:"#F00", "background-color": "#FF0", }, });



テスト




この記事は、以下のページを参考に作成しています。
jQuery Tips and Tricks

関連記事
同じカテゴリの記事はこちらから!! → JavaScript タグ:

コメントを残す

メールアドレスが公開されることはありません。