javascript - Why does this HTMLJS revert back to the original after changing the inner HTML?

I am starting to learn JavaScript and I was wondering why this doesn't permanently make "Ephemeral" appear before the button and why it reverts back to the original HTML page before the button is pressed?

index.html

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script type="text/javascript" src="mind.js"></script>
</head>
<body>
    <h1 id = "identifier"></h1>
    <form>
        <button value = "button!" onclick="doSomething()"> </button>
    </form>
</body>
</html>

mind.js

function doSomething() {
    document.getElementById("identifier").innerHTML = '<i>Ephemeral</i>';
}

index.html

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script type="text/javascript" src="mind.js"></script>
</head>
<body>
    <h1 id = "identifier"></h1>
    <form>
        <button value = "button!" onclick="doSomething()"> </button>
    </form>
</body>
</html>

mind.js

function doSomething() {
    document.getElementById("identifier").innerHTML = '<i>Ephemeral</i>';
}

Share Improve this question asked Sep 7, 2013 at 19:30 Arthur Collé 2,6075 gold badges29 silver badges39 bronze badges

who added syntax highlighting???? – Arthur Collé Commented Sep 7, 2013 at 22:43

Add a ment |

1 Answer 1

Sorted by: Reset to default 10

Because you're submitting the form, which is refreshing the page. Add return false to the inline handler, if you don't want to submit yet.

<button value = "button!" onclick="doSomething(); return false;"> </button>

Or add return before the call, and add return false to the function.

<button value = "button!" onclick="return doSomething();"> </button>

function doSomething() {
    document.getElementById("identifier").innerHTML = '<i>Ephemeral</i>';
    return false;
}

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

javascript - Why does this HTMLJS revert back to the original after changing the inner HTML? - Stack Overflow

1 Answer 1

与本文相关的文章

评论列表(0)