我正在用javascript在php上编码,并且确实发生了一些奇怪的事情。
我有此代码:
var lat = [];
var lng = [];
downloadUrl('db.php', function (data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName('marker');
Array.prototype.forEach.call(markers, function (markerElem) {
lat.push(markerElem.getAttribute('lat'));
lng.push(markerElem.getAttribute('lng'));
var icon = customLabel[type] || {};
var marker = new google.maps.Marker({
map: map,
position: point,
label: icon.label
});
});
});
当我运行console.log(lat)
或lng
时,我看到该数组包含一些条目(准确地说是9个),但是随后我打印了console.log(lat.length)
,并说长度为0。< / p>
但是如果在该代码下,我手动添加了更多条目lat.push("new entry");
,我看到它已添加到先前的内容中,并且长度更改为1.。在我添加新条目后的图片上,您可以看到长度为10,但是控制台报告1.有任何想法吗?
------编辑----
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
center: new google.maps.LatLng(47.401775, 8.772933),
zoom: 5
});
var infoWindow = new google.maps.InfoWindow;
// Change this depending on the name of your PHP or XML file
var lat = [];
var lng = [];
downloadUrl('db.php', function (data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName('marker');
Array.prototype.forEach.call(markers, function (markerElem) {
var id = markerElem.getAttribute('id');
var name = markerElem.getAttribute('name');
var address = markerElem.getAttribute('address');
var type = markerElem.getAttribute('type');
lat.push(markerElem.getAttribute('lat'));
lng.push(markerElem.getAttribute('lng'));
var infowincontent = document.createElement('div');
var strong = document.createElement('strong');
strong.textContent = name
infowincontent.appendChild(strong);
infowincontent.appendChild(document.createElement('br'));
var text = document.createElement('text');
text.textContent = address
infowincontent.appendChild(text);
var icon = customLabel[type] || {};
var marker = new google.maps.Marker({
map: map,
position: point,
label: icon.label
});
marker.addListener('click', function () {
infoWindow.setContent(infowincontent);
infoWindow.open(map, marker);
});
});
});
lat.push("new entry");
console.log(lat);
}
答案 0 :(得分:1)
这在异步操作中很常见。浏览器中数组旁边的小警告i
表示该数组的内容已被评估。当扩展数组时,浏览器控制台会延迟评估该数组。
另一方面,当您使用时:
console.log(array.length)
打印的长度与执行指令时的长度完全相同。
如果您希望在没有浏览器评估能力的情况下获得阵列的确切内容,请使用:
console.log(JSON.stringify(array))
您的代码在进行以下更改后应该可以工作:
function initMap() {
downloadUrl('db.php', function (data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName('marker');
Array.prototype.forEach.call(markers, function (markerElem) {
var id = markerElem.getAttribute('id');
var name = markerElem.getAttribute('name');
var address = markerElem.getAttribute('address');
var type = markerElem.getAttribute('type');
lat.push(markerElem.getAttribute('lat'));
lng.push(markerElem.getAttribute('lng'));
var infowincontent = document.createElement('div');
var strong = document.createElement('strong');
strong.textContent = name
infowincontent.appendChild(strong);
infowincontent.appendChild(document.createElement('br'));
var text = document.createElement('text');
text.textContent = address
infowincontent.appendChild(text);
var icon = customLabel[type] || {};
var marker = new google.maps.Marker({
map: map,
position: point,
label: icon.label
});
marker.addListener('click', function () {
infoWindow.setContent(infowincontent);
infoWindow.open(map, marker);
});
});
//log the array here
console.log(lat);
});
}