document.getElementById用於外部html中的元素

Question

我有這個HTML：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Notas</title>

    <script type="text/javascript" src="notas.js"></script>

</head>
<body>

    <p>Nombre alumno: </p>
    <input type="text" name="nombre" id="nombre">
    <p>Nota alumno:</p>
    <input type="text" name="nota">

    <p><br></p>
    <input type="button" name="boton" value="Enviar" onclick="respuesta()">

</body>
</html>

並將此Javascript放在另一個文件中：

function respuesta(){

    nombrej=document.getElementById("nombre");
    document.write(nombrej);
}

問題是，當我單擊按鈕時，消息為“空”，我在論壇中看到了類似問題的解決方案，但是由於有按鈕，所以我不知道該怎么辦。 救命！

Answer 1

那里有兩個問題：

您尚未聲明nombrej 。 （那不應該是nombre嗎？）這意味着您的代碼正在成為“隱式全球性恐怖”的犧牲品 （這是我博客上的帖子） 。 聲明變量。
您已將nombrej設置為HTMLInputElement 。 您可能想要它的值，該值位於它的value屬性上。
調用document.write一旦頁面已經完成將隱式調用document.open ，這抹了頁面，並與你寫的東西來替換它。

因此， respuesta可能看起來像這樣：

function respuesta(){

    var nombrej=document.getElementById("nombre").value;
//  ^^^--- #1                                    ^^^^^^--- #2
    console.log(nombrej);
//  ^^^^^^^^^^^--- #3
}

旁注：我看到您已經將您的script標簽放在head部分。 您會發現很多人這樣做並告訴您這樣做，但這是一種反模式。 除非您有特定原因要執行其他操作，否則請將script標記放在body的最后，即</body>標記之前。 有關YUI指南的更多信息。

Answer 2

JavaScript getElementById返回DOM元素。 要獲取該文本輸入的值，您需要獲取其值。

代替：nombrej = document.getElementById（“ nombre”）;

使用：nombrej = document.getElementById（“ nombre”）。value;

示例： JavaScript：如何獲取文本輸入字段的值？

document.getElementById用於外部html中的元素

問題描述

2 個解決方案

解決方案1
1 2016-09-29 18:05:10

解決方案2
0 已采納 2016-09-29 18:06:15

document.getElementById用於外部html中的元素

問題描述

2 個解決方案

解決方案1 1 2016-09-29 18:05:10

解決方案2 0 已采納 2016-09-29 18:06:15

解決方案1
1 2016-09-29 18:05:10

解決方案2
0 已采納 2016-09-29 18:06:15