Question

对于一个锚标记，我正在使用以下代码及其工作正常。

<h1 id="h1">heading</h1>
<a type="button" id="demo" onclick="Func()">sign-up</a>

JS

function Func() {
    document.getElementById("h1").innerHTML = "sign-up";
}

如何对3个或4个锚定标签执行此操作？

我真正想要的是每次单击定位标记时都会获得其文本，并将其显示在唯一的一个<h1></h1>标记中

JS 或 JQuery

Answer 1

您可以将class添加到所有链接，然后基于该链接为其添加click事件处理程序。

$(".buttons").click(e => $("#h1").text(e.currentTarget.textContent));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1 id="h1">heading</h1>
<a type="button" class="buttons">sign-up</a>
<a type="button" class="buttons">sign-in</a>

Answer 2

您应该尝试使用JQuery

您的h1标签，例如

<h1 id="anchorText"> </h1>

和您的锚标记（如

）

<a type="button" id="demo">sign-up</a>
<a type="button" id="demo1" >Login</a>

现在在您的jquery中

$("a").click(function(){
    $("#anchorText").text($(this).text());
});

Answer 3

您可以在this中传递Func()来引用被单击的元素，然后根据您的方便获得该元素的innerHTML（或innerText）。

function Func(e) {
  document.getElementById("h1").innerHTML = e.innerHTML;
}

<h1 id="h1">heading</h1>
<a type="button" id="demo1" onclick="Func(this)">sign-up</a>
<a type="button" id="demo2" onclick="Func(this)">sign-in</a>

获取锚标签的文本并在html标签中显示

3 个答案: