JavaScriptは、テキストボックスが、私はこのコードを実行すると

Question

が、私はコンソールでこのエラーを取得する値読み取ることができない

あなたが見ることができるようにヌル

のプロパティ「値」を読み取ることはできませんtxt1とtxt2の値がnullではなく、JavaScriptがHTMLコードにリンクされているため、私はそれをオーディオファイルでテストしました。

var audio = new Audio('sound/saw.mp3'); 
 
var min=0; 
 
min=document.getElementById('txt1').value; 
 
var max=0; 
 
max=document.getElementById('txt2').value;

<label id="lbl1" for="txt1">lowest number </label> 
 
<input id="txt1" type="text" class="enjoy" value="0"> 
 

 
<label id="lbl2" for="txt2">highest number </label> 
 
<input id="txt2" type="text" class="enjoy" value="100" /> 
 

Answer 1

これが最も可能性が高いタイミングの問題です。 JavascriptはDOMにロードされるまでノードを見つけることができません。

window.onload = function(){ 
    var audio = new Audio('sound/saw.mp3'); 
    var min=0; 
    min=document.getElementById('txt1').value; 
    var max=0; 
    max=document.getElementById('txt2').value; 
} 

あなたがそれらにアクセスしようとする前に、ノードが存在することを確認します：ちょうどwindow.onload()機能であなたのJSを包みます。あなたがここにそれについて少し詳細を読むことができます：https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onloadタグで/欠落がある

Answer 2

：

は次のようになります。

あなたはのコンテンツをしたい場合タグを使用する必要があります：

document.getElementById（ "txt1"）。innerHTML

あなたは属性値をしたい場合は、

のdocument.getElementById（「TXT1」）を使用する必要がありますのgetAttribute（「値」）

テキストフィールドの使用の値にアクセスする場合：。

document.getElementById（ "txt1"）。値

とにかくDOMをナビゲートするためにJQueryを使用すると、DOM APIよりはるかに簡単です。