背景:使用ArcGIS API for JavaScript做地图开发。后端JS代码中需要获取前端HTML中的各组件ID。为使前后端分离,现使用XML文件存储HTML文件中的各组件ID配对(即一个InnerId对应一个OuterId,InnerId供JS代码里调用,OuterId供前端开发使用)。
写一个方法去根据InnerId获取对应的OuterId:
function getByInnerId(innerId) {
$.ajax({
url: COMPONENTID_XML,
dataType: "xml",
type: "GET",
timeout: 1000,
async: false,
error: function(xml) {
console.log("加载XML文件出错!");
},
success: function(data) {
var returnOuterId = "";
var prefixId = innerId.substr(0, 2);
console.log(prefixId);
$(data).find("Components").each(function(group) {
var findValueTag = 0;
var groupId = $(this).attr("id");
if (groupId === prefixId) {
console.log("Get the group.");
$(this).find("Component").each(function(item) {
var itemInnerId = $(this).children("InnerId").text();
console.log(itemInnerId);
if (itemInnerId === innerId) {
var itemOuterId = $(this).children("OuterId").text();
if (returnOuterId.length === 0) {
returnOuterId = itemOuterId;
findValueTag++;
return false; //使用return false实现跳出该循环
}
}
});
}
if (returnOuterId != null) {
return false; //使用return false实现跳出该循环
}
});
return returnOuterId;
}
});
}
其中,COMPONENTID_XML内容为:
<?xml version="1.0" encoding="utf-8" ?>
<Content>
<Components id="NT" name ="NavigationToolbar" alias ="导航工具条">
<Component>
<InnerId>NT_ZoomIn</InnerId>
<OuterId>zoomin</OuterId>
</Component>
<Component>
<InnerId>NT_ZoomOut</InnerId>
<OuterId>zoomout</OuterId>
</Component>
<Component>
<InnerId>NT_PreviousExtent</InnerId>
<OuterId>zoomprev</OuterId>
</Component>
<Component>
<InnerId>NT_NextExtent</InnerId>
<OuterId>zoomnext</OuterId>
</Component>
</Components>
<Components id="TM" name ="ThematicMap" alias ="专题图">
<Component>
<InnerId>TM_ThematicMap</InnerId>
<OuterId>project</OuterId>
</Component>
<Component>
<InnerId>TM_BtnPrevious</InnerId>
<OuterId>thematicMap_prev_btn</OuterId>
</Component>
<Component>
<InnerId></InnerId>
<OuterId></OuterId>
</Component>
</Components>
</Content>
此外,另一种使用Dojo获取OuterId的方法为:
function getByInnerId(innerId) {
var resultIdValue;
var store = new dojox.data.XmlStore({ url: COMPONENTID_XML, rootItem: 'Component' });
var getOuterId = function (items, request) {
var i = items.length;
if (0 < i) {
var item = items[i];
var outerId = store.getValue(item, "OuterId");
var outerIdValue = outerId.element.innerHTML;
console.log(outerIdValue);
resultIdValue = outerIdValue;
}
return resultIdValue;
}
var request = store.fetch({ query: { InnerId: innerId }, queryOptions: { ignoreCase: true }, onComplete: getOuterId });
}