再次在页面上的其他地方显示 H1 而无需手动输入（作为一种变量）？

Question

我正在寻找一种仅需 HTML 或 JavaScript 即可在页面其他位置再次显示 H1 的方法。

我的意思是：我有一个手动输入的 H1 标题。我希望它再次自动显示在页面底部，而无需再次手动输入。（页面底部的东西只是一个例子，我的项目有点复杂）。

我想我正在搜索某种变量。

在此先感谢您的帮助。

Answer 1

假设您有一个标题元素。首先你需要 select 标题然后使用 cloneNode() 函数创建它的克隆，它接受一个 deep 参数，这基本上意味着节点和它的整个子树，包括可能在 child 文本节点，也被复制。之后我们基本上将克隆的元素附加到文档 body。

// select the heading
let el = document.querySelector('.heading');

// clone the element
let clone_el = el.cloneNode( true );


// append it to the body
document.body.append(clone_el);

<h1 class="heading">This is a heading</h1>

Answer 2

 x = document.getElementById("title").innerHTML ;
document.getElementById("reap").innerHTML = x;

 <h1 id="title">Your manually written title</h1>

<h1 id="reap">Where You want to show it again</h1>

您可以在后端的帮助下完成此操作，或者只为 H1 创建一个 ID，例如...

<h1 id="title">Your manually written title</h1>

<h1 id="reap">Where You want to show it again</h1>

只是 select 和

x = document.getElementById("title").innerHTML ;
document.getElementById("reap").innerHTML = x;

只需使用查询select或

创建一个变量

再次在页面上的其他地方显示 H1 而无需手动输入（作为一种变量）？

Show H1 somwhere else on the page again without typing it manually (as a kind of variable)?

html

javascript

variables

display