Javascript如何通過document.getElementById與HTML交互？

我希望我沒有問過已經回答過的問題 - 我無法找到任何關於此主題的具體內容。Javascript如何通過document.getElementById與HTML交互？

我的任務是通過Javascript創建「Hang子手」遊戲。我的教授給了我們一個關於遊戲的HTML標記，以及使用CSS對其進行了設計。我必須編寫Javascript來使遊戲工作。代碼包含在外部文件中。

HTML是否已接受了劊子手的初始字形式：

<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變量？

來源

2013-09-22 user2803472

是的，它應該，你有哪些代碼？注意：它不會連續執行，即當用戶更改輸入時，該變量將不會更新爲該變量，您將需要設置一個'onchange'事件或執行該代碼，如'saveWord（）'函數如果它不是已經 –

我已經嘗試在我的外部Javascript文件的開始處「獲取」Id。我聲明變量（userGuess）並嘗試將元素（hangManWord）的值放入新變量中。所以現在，變量應該包含輸入到表單框中並提交的內容。我試着在變量聲明之後立即創建一個循環語句。就像「如果userGuess.length == 6，然後警報」。 – user2803472

當右後（或）頁面加載，userGuess = document.getElementById("hangManWord").value設置變量userGuess爲空字符串賦值執行，因爲這是該value屬性設置爲，由於HTML屬性value=""。

當用戶使用input控件更改該值時，這不會更改userGuess值的值。可以使用document.getElementById("hangManWord").value來獲取控件的當前值。儘管如此，不能在之前獲取值。如果你願意，你可以使用例如var userGuess = document.getElementById("hangManWord")，創建對input元素的引用（對整個元素節點對象的引用，而不是僅獲取其中一個屬性的當前值），然後使用userGuess.value。

來源

2013-09-22 05:06:11

點擊發生的這個「saveWord（）」 - 我在其他任何地方都找不到它。這是一個函數，我需要在Javascript中聲明？聲明它做一個變量併爲它指定hangManWord元素單擊後的值？一旦存儲了該值，我是否應該能夠對該變量中的存儲值進行邏輯陳述？ – user2803472

是的，您必須編寫它，作爲「編寫Javascript以使遊戲工作」的任務的一部分。嘗試此操作之前，您可能需要閱讀JavaScript教程。 –

沒關係。我一直在做這些教程，但是當繼承預先製作的HTML時，情況會非常不同。不得不解決所提供的標記對我來說是新的。 – user2803472

是的，它會將表單的輸入放入userGuess變量中。但是你必須將你的代碼插入表單提交事件處理程序，這是函數「saveWord（）;」我相信你必須執行。它最終會做什麼只有在提交時纔會獲得輸入值。

來源

2013-09-22 04:36:00

Javascript如何通過document.getElementById與HTML交互？

回答

相關問題