HERE 本文にスタイル シートがある場合の Firefox と Chrome (IE ではない) の JavaScript API エラーをマップします。
作業例:
<!DOCTYPE html>
<html>
<head>
<title>Working</title>
<script type="text/javascript" src="http://js.api.here.com/se/2.5.3/jsl.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.w3.org/2008/site/css/minimum" />
</head>
<body>
<div id="map" style="height: 500px; width: 500px"></div>
<script type="text/javascript">
nokia.Settings.set('appId', *REMOVED*);
nokia.Settings.set('authenticationToken', *REMOVED*);
new nokia.maps.map.Display(document.getElementById('map'));
</script>
</body>
</html>
失敗例:
<!DOCTYPE html>
<html>
<head>
<title>Failing</title>
<script type="text/javascript" src="http://js.api.here.com/se/2.5.3/jsl.js"></script>
</head>
<body>
<div id="map" style="height: 500px; width: 500px"></div>
<link rel="stylesheet" type="text/css" href="http://www.w3.org/2008/site/css/minimum" />
<script type="text/javascript">
nokia.Settings.set('appId', *REMOVED*);
nokia.Settings.set('authenticationToken', *REMOVED*);
new nokia.maps.map.Display(document.getElementById('map'));
</script>
</body>
</html>
問題は、次のロジックにあるようです。
var f = c.styleSheets, p = f.length, a, k, m = c.createElement("style");
m.setAttribute("type", "text/css");
c.getElementsByTagName("head")[0].appendChild(m);
a = f[f.length - 1];
document.styleSheets は head 要素の後に body 要素を持つため、作成したばかりのスタイル要素ではなく、外部スタイル シートを操作しようとします。