嗨,我正在與Ajax和XML工作,並試圖與flickr應用程序工作flickr事情是,要獲取XML文檔中的特定元素,我這樣做這樣做var title = dataInfo.getElementsByTagName('title')[0];
我需要得到的照片的標題我從Flickr得到的,當我做到這一點爲什麼我得到[object element]?
$('#results').append("<img src ="+src+" width="+width+" height="+height+">"+title);
我的頭銜是[object element]
,爲什麼它不顯示HTML類似標題?
這裏是全碼:(basicly我有3個Ajax請求(第一次獲得了一些照片中,第二次獲得基於我的HTML按鈕的大小,三是照片信息):
$(document).ready(function() {
var numero = 10;
var clicked = 1;
$("#sq").click(function(){
clicked = 1;
});
$("#lg-sq").click(function(){
clicked = 2;
});
$("#thumb").click(function(){
clicked = 3;
});
$("#small").click(function(){
clicked = 4;
});
$("#mid").click(function(){
clicked = 5;
});
$("#apagar").click(function() {
$("#results").html('');
});
$('#pesquisar').click(function() {
$("#results").html('');
$.ajax({
url: 'https://api.flickr.com/services/rest/?method=flickr.photos.search',
dataType: 'xml',
data: {
api_key: '2fd41b49fedfd589dc265350521ab539',
tags: $("#tag").val(),
format: 'rest'
},
success: sucessHandler,
error: errorHandler
});
function sucessHandler(data) {
$("#results").html('');
var fotos = Array.prototype.slice.call($(data).find("photo"));
if ($("#numero").val() != "") {
numero = parseInt($("#numero").val());
console.log("entrou");
}
fotos.forEach(function(foto,key) {
if(key < numero){
$.ajax({
url: 'https://api.flickr.com/services/rest/?method=flickr.photos.getSizes',
dataType: 'xml',
data: {
api_key: '2fd41b49fedfd589dc265350521ab539',
photo_id: $(foto).attr('id'),
format: 'rest'
},
success: function(dataSize){
var farmId = $(foto).attr('farm');
var serverId= $(foto).attr('server');
var Id = $(foto).attr('id');
var secret = $(foto).attr('secret');
var src = "https://farm" + farmId + ".staticflickr.com/"+ serverId +"/" + Id + "_"+secret+".jpg";
$.ajax({
url: 'https://api.flickr.com/services/rest/?method=flickr.photos.getInfo',
dataType: 'xml',
data: {
api_key: '2fd41b49fedfd589dc265350521ab539',
photo_id: $(foto).attr('id'),
format: 'rest',
secret: secret
},
success: function(dataInfo){
if(clicked == 1){
var size = dataSize.getElementsByTagName('size')[0];
var title = dataInfo.getElementsByTagName('title')[0];
console.log(title);
var width = $(size).attr("width");
var height = $(size).attr("height");
$('#results').append("<img src ="+src+" width="+width+" height="+height+">"+title);
}
if(clicked == 2){
var size = dataSize.getElementsByTagName('size')[1];
var width = $(size).attr("width");
var height = $(size).attr("height");
$('#results').append("<img src ="+src+" width="+width+" height="+height+">");
}
if(clicked == 3){
var size = dataSize.getElementsByTagName('size')[2]
var width = $(size).attr("width");
var height = $(size).attr("height");
$('#results').append("<img src ="+src+" width="+width+" height="+height+">");
}
if(clicked == 4){
var size = dataSize.getElementsByTagName('size')[3]
var width = $(size).attr("width");
var height = $(size).attr("height");
$('#results').append("<img src ="+src+" width="+width+" height="+height+">");
}
if(clicked == 5){
var size = dataSize.getElementsByTagName('size')[4]
var width = $(size).attr("width");
var height = $(size).attr("height");
$('#results').append("<img src ="+src+" width="+width+" height="+height+">");
}
},
error: function(req,status,err){
}
});
},
error: errorSize
});
}
});
function errorSize(req, status, err) {
console.log("error size");
}
}
function errorHandler(req, status, err) {
console.log("fail");
}
});
});
相關部分:
if(clicked == 1){
var size = dataSize.getElementsByTagName('size')[0];
var title = dataInfo.getElementsByTagName('title')[0];
console.log(title);
var width = $(size).attr("width");
var height = $(size).attr("height");
$('#results').append("<img src ="+src+" width="+width+" height="+height+">"+title);
這是因爲你添加了DOMElement而不是字符串。假設你想訪問元素的屬性,例如'var title = dataInfo.getElementsByTagName('title')[0] .innerText;' –
@RoryMcCrossan'innerText'是非標準的。改爲使用'textContent'。 –
還要注意,你可以使用'clicked'變量通過索引來訪問'size'元素,而不是使用N個重複的'if'語句來大規模幹掉你的代碼 –