0
我有一个网站为JSON数据发出HTTP请求,然后回调函数处理数据并通过动态创建一系列div来显示它。我想要做的是等待该功能完成将div添加到页面,然后将标签仅应用于由以前的代码创建的特定div。如何在加载后更改动态创建的元素javascript
HTTP请求和回调
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);
上面的代码显示我的数据正是我想要它,但是当我尝试访问我想改变的div的编号ID,函数运行在页面上显示数据之前,由于我尝试更改的数据尚未添加到DOM,导致“空”错误。
二功能改变原有
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新手,并不知道从哪里开始。
感谢您的帮助!