0

私は単純な JavaScript コードに取り組んでいましたが、何が機能していないのかわかりません。これがわかったら教えてください。

<!DOCTYPE html>
<html>
<head>
<script>
function displayText(){
var xa = document.getElementById('abcd').innerHTML;
xa+= 'asdf';
}

displayText();  
</script>
</head>
<body>
<div id="abcd"></div>
</body>
</html>
4

2 に答える 2

6

innerHTML要素へのポインターではなく、要素の現在の内容の文字列を返します。代わりにこれを使用してください：

function displayText(){
  document.getElementById('abcd').innerHTML += 'asdf';
}

また

function displayText(){
  var el = document.getElementById('abcd'); 

  var xa = el.innerHTML;
  xa += 'asdf';

  el.innerHTML = xa;
}

さらに、参照している要素が実際に作成される前に、関数を呼び出すことはできません。そのため、body タグの下部に呼び出しを移動します。

<!-- .... -->
<script>
  display();
</script>
</body>
于 2013-02-23T11:20:02.587 に答える
0

コードが実行される時点では、本体 (div を含む) はまだ解析されていません。getElementById('abcd')その時点では何も見つかりません。

本文が解析された後に実行されるようにスクリプト要素を本文の最後に移動するか、ハンドラdisplayText()から関数を呼び出します。onload

(また、新しい値をxa同じフィールドに表示する場合は、 を使用して要素に書き戻す必要がありますdocument.getElementById('abcd').innerHTML = xa。)

于 2013-02-23T11:19:26.297 に答える