Javascript如何通过document.getElementById与HTML交互?

时间:2013-09-22 04:29:40

标签: javascript html

我希望我不会问一个之前已经回答的问题 - 我无法特别找到有关此主题的任何内容。

我的任务是通过Javascript创建一个“Hangman”游戏。我的教授给了我们一个游戏的HTML标记,以及用CSS设置的样式。我必须编写Javascript才能使游戏正常运行。代码包含在外部文件中。

HTML的表单接受hangman的初始单词:

<div id="enterWordContainer" align="center">
Enter a six letter word for hangman:  <input id="hangManWord" type="text" value="" />
<input type="button" value="Submit" onclick="saveWord();"/> </div>

如何开始操作我在HTML文档中输入的文本?

我尝试过创建一个包含文本的变量:

var userGuess = document.getElementById("hangManWord").value;

这不应该将表单的输入放入Javascript变量吗?

2 个答案:

答案 0 :(得分:2)

在页面加载后(或在页面加载)执行时,赋值userGuess = document.getElementById("hangManWord").value将变量userGuess设置为空字符串,因为这是value属性设置为的内容,由于HTML属性value=""

当用户使用input控件更改值时,这不会更改userGuess值的值。

saveWord函数中,您可以使用document.getElementById("hangManWord").value来获取控件的当前值。但是,无法在输入值之前获取值。如果您愿意,您可以使用例如var userGuess = document.getElementById("hangManWord"),创建对input元素的引用(对整个元素节点对象的引用,而不是仅获取其中一个属性的当前值),然后再使用userGuess.value。 / p>

答案 1 :(得分:0)

是的,它会将表单的输入放入userGuess变量中。但是你必须将你的代码插入表单提交事件处理程序,这是函数“saveWord();”我相信你必须实施。 它最终将做的是仅在提交时获取您的输入值。