jquery - テンプレート コードをページにコピーする

Question

display:none を使用して、ページの下部にいくつかの html DIV を隠しておきたいと思います。定期的に、これらの DIV の 1 つをコピーし、いくつかのカスタム変更 (display:block など) を行い、それを DOM のどこかに挿入したいと考えています。操作の最後に、テンプレート DIV は変更されずにページの下部にあるはずです。

誰かがこれを達成するための最良のjQueryを提案できるかどうか疑問に思っていますか?

ありがとう

Answer 1

上記のcouzziに同意します。これらは動的に作成する必要があります。ただし、これは私があなたの質問をどのように解釈したかです(単純な概念): http://jsfiddle.net/5xJBN/

<div>You can see me!</div>

<div id="append"></div>

<input type="button" value="click me" id="btn"/>

<div id="hidden1" style="display: none;">You cant see this!</div>

下部の div の上が非表示になっていることがわかります。それを選択し、コンテンツを取り出し、ID: append で div に追加し、色を赤に変更します (ボタンのクリック時)。

$("#btn").click(function() {
var hiddenDiv = $("#hidden1").html();
$("#append").html(hiddenDiv).css("color", "red");
});

非表示の div は変更されず、表示されません。