Отображение скрытого html в диалоге jQuery UI

Question

Я использую диалог jQuery UI. Чтобы очень красиво обернуть окно вокруг моего контента, я должен сначала загрузить диалог на 2 пустых вложенных элемента div (<div><div></div></div>). Затем, после открытия Диалога, я заполняю Диалог контентом. Я потратил много времени на это ... это не то, о чем этот вопрос. Пожалуйста, не предлагайте альтернативы этому механизму.

Моя проблема только в том, что мне нужно отобразить html с веб-страницы, как показано ниже:

<div id="mydialog">
  <form>
    <label for="name">My name:</label>
    <input type="text" id="name" name="name"/>
  </form>
</div>

Тем не менее, я хочу, чтобы этот HTML выше был скрыт на веб-странице. Поэтому я установил CSS на display: none;. Затем я делаю. append($('#mydialog')).children().css('display', 'block'); для внутреннего div диалога.

Мой вопрос ... как мне удалить HTML с веб-страницы? Делая jQuery-приложение, я не делаю полную копию? У меня проблемы с производительностью, потому что у меня их куча. Вместо .append () я должен делать что-то вроде $('#mydialog').moveTo('#innerDivOfDialog');? Должен ли я сделать $('#mydialog').removeFromWebpage(); на оригинальном скрытом HTML? Есть ли метод jQuery, который делает removeFromWebpage ()? Какой здесь правильный механизм?

Answer 1

С jQuery добавление документов :

Мы также можем выбрать элемент на странице и вставить его в другой:

$('.container').append($('h2'));

Если элемент, выбранный таким образом, вставлен в другое место, он будет перемещен в цель

Итак, он перемещается, а не копируется.

Если вы все еще заинтересованы в удалении, см. jQuery remove

Answer 2

Вы можете удалить эти элементы из DOM (не HTML, который является статическим, как только он был получен клиентом, но на самом деле это просто вопрос того, что вы называете вещами), все что вам нужно, это вызвать .detach() onперемещенный элемент перед добавлением его в нужное место.

$foo.append($('#mydialog').detach()).children().css('display', 'block');