我可以使用JavaScript .value属性将数据从一个div复制到另一个div吗？

Question

我是JS的新手,我想做的只是使用JS将数据从一个div复制到另一个div但是我得到了未定义的错误

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

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

Answer 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>

Answer 2

据innerHTMLMDN称:

注意:如果<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>

由于在这种情况下您可能希望复制HTML内容,innerHTML但这可能已足够,但如果您要将该数据仅用作文本,则可能更喜欢上面的替代属性.