Могу ли я скопировать данные из одного div в другой div с использованием свойства JavaScript.value?

Я очень новичок в JS здесь, что я хочу сделать, это просто скопировать данные из одного div в другой div с помощью JS, но я получаю неопределенную ошибку

<div id="div_one">Hello</div>
<div id="div_two"></div>

<script>
document.getElementById("div_two").innerHTML = 
document.getElementById("div_one").value;
</script>

Ответы

Ответ 1

Для получения значения нужно взять свойство innerHTML.

value доступно только для некоторых элементов, таких как <button>, <option>, <input>, <li>, <meter>, <progress>, <param>.

document.getElementById("div_two").innerHTML =
    document.getElementById("div_one").innerHTML;
<div id="div_one">Hello</div>
<div id="div_two"></div>

Ответ 2

Согласно innerHTML MDN:

Примечание. Если узел <div>, <span> или <noembed> имеет дочерний текстовый узел, который содержит символы (&), (<) или (>), innerHTML возвращает эти символы как &amp, &lt и &gt соответственно, Используйте Node.textContent чтобы получить правильную копию содержимого этих текстовых узлов.

  • textContent часто имеет лучшую производительность, потому что текст не анализируется как HTML.
  • Более того, использование textContent может предотвратить атаки XSS.

В этом смысле вы также можете попробовать альтернативные свойства:

let div1IH = document.getElementById("div_one").innerHTML;
console.log(div1IH);
let div1TC = document.getElementById("div_one").textContent;
console.log(div1TC);
let div1IT = document.getElementById("div_one").innerText;
console.log(div1IT);
document.getElementById("div_two").innerHTML = div1IH;
document.getElementById("div_three").innerHTML = div1TC;
document.getElementById("div_four").innerHTML = div1IT;
<div id="div_one">Hello & > _ < & </div>
<div id="div_two"></div>
<div id="div_three"></div>
<div id="div_four"></div>