首页 > 解决方案 > 如何使用 javascript 按钮更改标题的文本?

问题描述

菜鸟在这里。我想用一些文本制作一个变量,这样当我点击它时,旧文本就会变成新文本。

<!DOCTYPE html>
<html>
<body>

<h1 id="id01">THis is the old text</h1>

<p>Click on "My Button" to display its value attribute.</p>

<button id="myBtn" name="myname" value="myvalue" 
onclick="alert(this.value)">My Button</button>

<p>Click on "Try it" to change the value attribute of "My Button".</p>

<button onclick="myFunction()">Try it</button>

<p><b>Tip:</b> Click on "My Button" before and after you have clicked on 
"Try it".</p>

<script>
function myFunction() {
    document.getElementById("myBtn").value = "newButtonValue";
    document.getElementById("id01").value = "this is the new text";
}
</script>

</body>
</html>

这是我使用的第一个示例,但 var = 会是更好的选择。

标签: javascriptjqueryhtmlbuttontext

解决方案


使用 innerText 而不是值。

function myFunction() {
    document.getElementById("myBtn").value = "newButtonValue";
    document.getElementById("id01").innerText = "this is the new text";
}
<h1 id="id01">THis is the old text</h1>

<p>Click on "My Button" to display its value attribute.</p>

<button id="myBtn" name="myname" value="myvalue" 
onclick="alert(this.value)">My Button</button>

<p>Click on "Try it" to change the value attribute of "My Button".</p>

<button onclick="myFunction()">Try it</button>

<p><b>Tip:</b> Click on "My Button" before and after you have clicked on 
"Try it".</p>


推荐阅读