1

jqueryを使用して一連のdivを表示し、ブラウザの幅が変わるvarとdivの位置が変更されます。nth-child

div を表示する var コードを次に示します。

var theDivs={
"div1":$("<div />").addClass("test"),
"div2":$("<div />").addClass("test2"),
"div3":$("<div />").addClass("test3"),
"div4":$("<div />").addClass("test4")
};

そこで、4 つの div を作成してから、一連の「テスト」クラスを追加します。これはうまく機能しますが、divクラス名を追加するだけでなく、コードのようにhtmlを追加できるようにしたいと思い.afterます..例:

$( '.somedivclass' ).after( '<div class="test"><a href="#"></a></div>');

現在のコードの完全な例を次に示します (HTML ウィンドウのサイズを変更して、div の nth-child 位置の変更を確認します)。

http://jsfiddle.net/EUqEm/85/

そうです、ブラウザの幅の変更でdivの位置が変わる現在のコード(私のjsfiddleを参照)で動作させながら、テストdiv内に独自のhtmlコードを追加できるようにしたいと思います。

どんな入力やヘルプも素晴らしいものであり、動作する jquery はさらに優れています! :)

4

2 に答える 2

1

要素.html()に HTML コンテンツを追加するために使用できます。div

var theDivs={
    "div1":$("<div />").addClass("test").html('<span>RED</span>'),
    "div2":$("<div />").addClass("test2").html('<span>BLUE</span>'),
    "div3":$("<div />").addClass("test3").html('<span>GREEN</span>'),
    "div4":$("<div />").addClass("test4").html('<span>PURPLE</span>')
};

サイズ変更時にコンテンツが確実に削除されるようにするには、 を使用できます.empty()

$("#wrapper div").attr("class","inner").empty();

jsfiddle

于 2013-02-07T01:52:55.920 に答える
0

これのことですか?

var theDivs={
"div1":$("<div />").addClass("test").text('Some text'),
"div2":$("<div />").addClass("test2").text('Some text'),
"div3":$("<div />").addClass("test3").text('Some text'),
"div4":$("<div />").addClass("test4").text('Some text')
};
于 2013-02-07T01:51:43.297 に答える