Javascript 单击文本更改

所以我对html非常陌生，需要一些帮助

我试着制作3个按钮，当你点击它们时，每个按钮都会改变旁边的文本。我为每个按钮使用以下代码：

<a href="#" onClick="document.getElementById('past').innerHTML='---future---';">

当我点击按钮时，文本将在innerHTML=“”之后的文本中更改。问题是，我在places上添加了很多文本——future——它将不再在浏览器中加载它。屏幕不会更新。我如何克服这个问题？我遇到这个问题已经有很长一段时间了，因此我们将感谢您的帮助。

<script>
function changeText()
{
 document.getElementById('boldStuff').innerHTML = 'Fred Flinstone';
}
</script>
<p>Welcome to the site <b id='boldStuff'>dude</b> </p> 
<input type='button' onclick='changeText()' value='Change Text'/>
</body>
</html>

函数changeText（）
{
document.getElementById（'boldStuff'）.innerHTML='Fred Flinstone'；
}
欢迎来到网站dude

试试这个代码。它对我有用。 在上面的代码中，我使用了[bold]标记来聚焦它，您可以使用缩写标记。

<p id="peep"></p>

<button onclick="myFunction('Harry Potter')">Click for Harry Potter</button>
<button onclick="myFunction('Bob')">Click for Bob</button>

<script>
function myFunction(name)
{
document.getElementById("peep").innerHTML = "Welcome " + name;
}
</script>

点击寻找哈利波特 点击寻找鲍勃 函数myFunction（名称） { document.getElementById（“peep”）.innerHTML=“欢迎”+名称； } 在所有按钮上使用相同的功能来更改文本

---

选中此项。

尝试此项可在单击文本时更改文本：

 <div id="chgtext">This is my current text</div>
    <a href="#" onclick="document.getElementById('chgtext').innerHTML='Change the text using javascript';">Change text</a> &nbsp; &nbsp;
    <a href="#" onclick="document.getElementById('chgtext').innerHTML='Text will be changed based on the other text';">Change text2</a>&nbsp;  &nbsp;
    <a href="#" onclick="document.getElementById('chgtext').innerHTML='This is another sample changed text on click the onther text';">Change text3</a>&nbsp;  &nbsp;
    </div>

这是我当前的文本

---

以下是使用此代码的方法：

HTML:

欢迎来到
点击查看未来

JS:

函数在（）上单击{
document.getElementById（'future-clicked'）。innerHTML='future-World'；
}

---

对于初学者，这是JavaScript，不是HTML。您在控制台中看到了什么错误？它适用于长文本：

<h1> Welcome to the </h2><span id="future-clicked"></span>

<button onclick="clicked_on()">Click for future</button>

<script>
    function clicked_on(){
        document.getElementById('future-clicked').innerHTML = 'Future World';
    }