【发布时间】:2014-03-28 10:15:08
【问题描述】:
我正在尝试使用 javascript 解析动态 xml 文件。但是 <link> 元素内的 url 包含琥珀色符号 ( & )。
所以我必须创建一个函数,用'&amp;'动态替换符号'&'。
你知道我要怎么做吗?
这是整个html文件
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>metar.gr</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="util.js"></script>
<script src="js/libs/require.js" data-main="js/mobile"></script>
<link rel="stylesheet" href="https://d10ajoocuyu32n.cloudfront.net/mobile/1.3.1/jquery.mobile-1.3.1.min.css"/>
<link rel="stylesheet" href="fonts-and-colors.css" type="text/css" media="screen">
<script type="text/javascript">
var infowindow;
var map;
function initialize() {
var myLatlng = new google.maps.LatLng(38.822590,24.653320);
var myOptions = {
zoom: 6,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
downloadUrl("moredata.xml", function(doc) {
var items = doc.documentElement.getElementsByTagName("item");
for (var i = 0; i < items.length; i++) {
var description = items[i].getElementsByTagName("description")[0].textContent;
var temp = items[i].getElementsByTagName("temp")[0].textContent;
var title = items[i].getElementsByTagName("title")[0].textContent;
var link = items[i].getElementsByTagName("link")[0].textContent;
var windSpeed = items[i].getElementsByTagName("windSpeed")[0].textContent;
var dailyRain = items[i].getElementsByTagName("dailyRain")[0].textContent;
var latlng = new google.maps.LatLng(parseFloat(items[i].getElementsByTagName("glat")[0].textContent),
parseFloat(items[i].getElementsByTagName("glon")[0].textContent));
if ( temp <= "1 °C" ) {
//alert(temp);
var marker = createMarker( temp,latlng,cold );
}
if ( temp >= "38 °C" ) {
//alert(temp);
var marker2 = createMarker2( temp,latlng,hot );
}
}
});
}
var cold = 'weather_icons/pagetos2.png';
var hot = 'weather_icons/hot.png';
function createMarker( temp,latlng,cold ) {
var marker = new google.maps.Marker({
position: latlng,
map: map,
icon: cold
});
google.maps.event.addListener(marker, "click", function() {
if (infowindow) infowindow.close();
infowindow = new google.maps.InfoWindow({
content: temp
});
infowindow.open(map, marker);
});
return marker;
}
function createMarker2( temp,latlng,hot ) {
var marker2 = new google.maps.Marker({
position: latlng,
map: map,
icon: hot
});
google.maps.event.addListener(marker2, "click", function() {
if (infowindow) infowindow.close();
infowindow = new google.maps.InfoWindow({
content: temp
});
infowindow.open(map, marker2);
});
return marker2;
}
</script>
</head>
<body onload="initialize()">
<div data-role="header" data-theme="b">
<div align="center">
<img onclick='doAction("showStoreLocatorMap()")' src="http://www.metar.gr/templates/metar/images/metar.gif" alt="main logo" vspace="2"/>
</div>
<a href="main.html" data-role="button" data-inline="true">Home</a>
</div>
<div data-role="content">
<div id="map_canvas" ></div>
</div>
<div data-role="info_icons">
<ul data-role="listview" id="icon_info" data-theme="c">
<img src="weather_icons/pagetos2.png"/>
<h3 class="ui-li-heading">Cold</h3>
<p class="ui-li-desc">temprature < +4° C</p>
</li>
<li>
<img src="weather_icons/hot.png"/>
<h3 class="ui-li-heading">Hot</h3>
<p class="ui-li-desc">temprature > +38° C</p>
</li>
</ul>
</div>
<div data-role="footer" data-theme="b">
<h4>metar.gr mobile version</h4>
</div>
</body>
</html>
xml文件示例
<item>
<description>Thesaloniki</description>
<glat>40.422726139672626</glat>
<glon>22.93392777442932</glon>
<title>makedonia</title>
<temp>60 °C</temp>
<dailyRain>0 mm</dailyRain>
<windSpeed>3.1 km/hr</windSpeed>
<link>
http://www.metar.gr/index.php?option=com_jumi&fileid=12&Itemid=73&station=1475
</link>
</item>
<item>
<description>Giannena</description>
<glat>39.62209843837158</glat>
<glon>20.89027225971222</glon>
<title>ipiros</title>
<temp>-16.9°C</temp>
<dailyRain>0.0 mm</dailyRain>
<windSpeed>10 km/hr</windSpeed>
<link>
http://www.metar.gr/index.php?option=com_jumi&fileid=12&Itemid=73&station=1227
</link>
</item>
<item>
<description>Athina</description>
<glat>38.08469095792561</glat>
<glon>23.680233657360077</glon>
<title>sterea</title>
<temp>45°C</temp>
<dailyRain>0.0 mm</dailyRain>
<windSpeed>97 km/hr</windSpeed>
<link>
http://www.metar.gr/index.php?option=com_jumi&fileid=12&Itemid=73&station=1009
</link>
</item>
util.js 文件的一部分
function downloadUrl(url, callback) {
var status = -1;
var request = createXmlHttpRequest();
if (!request) {
return false;
}
request.onreadystatechange = function() {
if (request.readyState == 4) {
try {
status = request.status;
} catch (e) {
// Usually indicates request timed out in FF.
}
if (status == 200) {
callback(request.responseXML, request.status);
request.onreadystatechange = function() {};
}
}
}
request.open('GET', url, true);
try {
request.send(null);
} catch (e) {
changeStatus(e);
}
};
【问题讨论】:
-
我不明白。 解析 XML 时为什么需要
htmlSpecialChars?你刚刚解析了它,并且有一个简单的值(这很好!)。你打算用link做什么? -
@Bergi — XML 无效,需要修复才能解析。
-
@Quentin:即使是这样,
downloadURL也需要处理它,而不是通过解析的doc传递的回调。 -
@Bergi — 理想情况下是这样,但第三方内容并不那么容易修复。
-
@Bergi 这是一个真实的 xml 样本。这次我不需要使用 。但问题是我无法编辑 xml 文件。所以 必须保留。
标签: javascript xml parsing dom special-characters