2016-08-30 9 views
0

JSONデータのHTTP要求を行うサイトがあり、コールバック関数がデータを処理し、一連のdivを動的に作成して表示します。私がしたいのは、その関数がページにdivを追加するのを待ってから、前のコードで作成された特定のdivにのみラベルを適用することです。上記のコードは、私はそれがしたいが、私は、私が変更したいのdivの番号をIDにアクセスしようとすると、機能の実行方法を正確に私のデータを表示するJavaScriptをロードした後に動的に作成された要素を変更する方法

function data(callback){ 
    var url = //request url; 
    var request = new XMLHttpRequest(); 
     request.onreadystatechange = function() { 
      if (request.readyState === 4) { 
       if (request.status === 200) { 
        document.body.className = 'ok'; 
        //Parse returned string into an object, then pass the object to the callback function. 
        var data = JSON.parse(request.responseText); 
        callback(data); 
       } else { 
        document.body.className = 'error'; 
       } 
      } 
     }; 
    request.open("GET", url , true); 
    request.send(null); 
} 
function dataDisplay(data){ 
    //outputs <div id="1064" class="displayed-data"> 
        <p id="message1" class="hidden"></p> 
} 
data(dataDisplay); 

HTTPリクエストとコールバック変更しようとしているデータがまだDOMに追加されていないため、ページにデータが表示される前に「null」エラーが発生します。私は、コールバックがそれにアクセスして変更しようとする前に完了するまで待機する第2の機能を取得するにはどうすればよいの元

function label(){ 
    var message1 = document.createTextNode('//some label'); 
    var displayedData = document.getElementById('1064').getElementById('message1'); 
    displayedData.appendChild(message1); 
    document.getElementById('message1').classList.remove('hidden'); 
} 

を変更する

第二の機能?私はコールバックの中でコールバックを試みました:label(data(dataDisplay));しかし、それは同じエラーを投げたので、間違っていました。申し訳ありませんが、私はJavaScriptを初めて熟知しており、ここからどこに行くのか本当に分かりません。

ありがとうございました!

答えて

1

これを正しく実行するには、このインライン関数を使用するのが簡単です。

data(function(result) { 
    dataDisplay(result); 
    label(); 
}); 

あなたdata機能自体は非常に迅速に完了することに注意してください - あなたはその結果から何かを必要とする場合には、そのコールバックにそれを含める必要があります。

関連する問題