のdocument.getElementById（ 'url_input'）値は、私がフォローコードとテキスト入力の値を取得するためにトリングた

Question

値を印刷しません私がこのように変わった場合：

var input = document.getElementById('url_input'); 
document.getElementById("send_url").onclick = function(){ 
    console.log(input.value); 
} 

この2つの違いは何ですか？なぜ最初のものが動作していないのですか？

Answer 1

この2つの違いは何ですか？ inputにあなたの最初の例では

、あなたコピー値：

var input = document.getElementById('url_input').value; 

た後、繰り返し再ログインし、その値：doesnのinputに値をコピーする

document.getElementById("send_url").onclick = function(){ 
    console.log(input); 
} 

」 inputとHTMLInputElementのvalueプロパティの間に進行中のリンクを作成します。そのコード行がになると、valueの値がinputにコピーされます。あなたはその現在状態のためHTMLInputElementを求めている、各クリックで

var input = document.getElementById('url_input'); 
document.getElementById("send_url").onclick = function(){ 
    console.log(input.value); 
} 

：あなたの2番目の例では

は、あなたがHTMLInputElementから毎回値を取得しています。 inputの値はクリック間で変わらないことに注意してください。これはオブジェクトであるurl_input要素への参照であり、このコードではその参照は変更されません。オブジェクトの（HTMLInputElement）が変更されており、その都度現在の状態を尋ねています。

Answer 2

.valueを読むと、それはその時点の値です。プロパティが変更されたときに変数を更新し続けることはありません。

だから、値を格納する場合は、時間内にその瞬間に

var input = document.getElementById('url_input').value 

を行うと、それが変数になります値です。