.html() и .append() без jQuery

Ответ 1

Чтобы скопировать HTML из одного div в другой, просто используйте DOM.

function copyHtml(source, destination) {
  var clone = source.ownerDocument === destination.ownerDocument
      ? source.cloneNode(true)
      : destination.ownerDocument.importNode(source, true);
  while (clone.firstChild) {
    destination.appendChild(clone.firstChild);
  }
}

Для большинства приложений inSameDocument всегда будет истинным, поэтому вы, вероятно, можете удалить все части, которые работают, когда они ложны. Если ваше приложение имеет несколько фреймов в одном и том же домене, взаимодействующем с помощью JavaScript, вы можете захотеть сохранить его.

Если вы хотите заменить HTML, вы можете сделать это, опустошив цель и затем скопировав ее:

function replaceHtml(source, destination) {
  while (destination.firstChild) {
    destination.removeChild(destination.firstChild);
  }
  copyHtml(source, destination);
}

Ответ 2

Вы можете заменить

var content = $("#id").html();

с

var content = document.getElementById("id").innerHTML;

и

$("#id").append(element);

с

document.getElementById("id").appendChild(element);

Ответ 3

• .html(new_html) можно заменить на .innerHTML=new_html
• .html() можно заменить на .innerHTML
• .append() метод имеет 3 режима:
  • Добавление элемента jQuery, который здесь не имеет значения.
  • Добавление/перемещение элемента dom.
    .append(elem) можно заменить на .appendChild(elem)
  • Добавление HTML-кода.
    .append(new_html) можно заменить на .innerHTML+=new_html

Примеры

var new_html = '<span class="caps">Moshi</span>';
var new_elem = document.createElement('div');
// .html(new_html)
new_elem.innerHTML = new_html;
// .append(html)
new_elem.innerHTML += ' ' + new_html;
// .append(element)
document.querySelector('body').appendChild(new_elem);

Примечания

• Вы не можете добавлять теги с помощью innerHTML. Вам нужно будет использовать appendChild.

• Если ваша страница является строгой xhtml, добавление нестрого xhtml приведет к ошибке script, которая приведет к поломке кода. В этом случае вы захотите обернуть его try.

• jQuery предлагает несколько других, менее простых ярлыков, таких как prependTo/appendTo after/before и многое другое.

  /li >

Ответ 4

.html() и .append() являются функциями jQuery, поэтому без использования jQuery вы, вероятно, захотите посмотреть document.getElementById("yourDiv").innerHTML

Javascript InnerHTML

Ответ 5

Несколько лет опоздали на вечеринку, но в любом случае, вот решение:

document.getElementById('your-element').innerHTML += "your appended text";

Это отлично подходит для добавления html в элемент dom.

Ответ 6

код:

<div id="from">sample text</div>
<div id="to"></div>

<script type="text/javascript">
var fromContent = document.getElementById("from").innerHTML;
document.getElementById("to").innerHTML = fromContent;
</script>