1

HTMLファイルを呼び出す簡単なスクリプトimテストがあります。そのhtmlファイルにはidのdivがあります"test2"。

次に、innerHTMLにコンテンツを追加しようとしていますが、ブラウザにdivが表示されていても、コンテンツが存在しないように動作します。

これが私がアイデアにアプローチした方法です：

<script>

function call_file(file,div_id){
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById(div_id).innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET",file,true);
xmlhttp.send();

}

window.onload = function() {  

  file = 'test.html';
  div_id = 'test';
  call_file(file,div_id);
  document.getElementById('test2').innerHTML = 'Hi';
};
</script>
  <div id="test" class="outer""></div>

「test.html」の内容：

<div id="test2" class="inner"></div>

"test2"自分の目でdivを表示しているのに、なぜこのエラーでidが見つからないのですか？

Cannot set property 'innerHTML' of null
4

2 に答える 2

2

非同期呼び出しを行っているためsend()、応答が受信されてDOMに追加される前に戻ります。受信したデータに依存するコードはすべてonreadystatechange関数内にあるか、何らかの形でトリガーされて、応答データが受信されるまで実行されないようにする必要があります。

于 2012-10-15T05:24:20.077 に答える
1

まだ存在しないため設定できません。ロードされるまで待つ必要があります。

あなたはコールバック関数でそれをすることができます。

function call_file(file,div_id, callback){
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById(div_id).innerHTML=xmlhttp.responseText;
    return callback();
    }
  }
xmlhttp.open("GET",file,true);
xmlhttp.send();

}

window.onload = function() {  

  file = 'test.html';
  div_id = 'test';
  call_file(file,div_id, function () {
   document.getElementById('test2').innerHTML = 'Hi';
  });
};
于 2012-10-15T05:24:00.297 に答える