0

当正文中有样式表时，在 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 将在头部元素之后在正文中包含元素，因此这会尝试操作外部样式表而不是它刚刚创建的样式元素。

4

1 回答 1

0

根据链接上的HTML5 规范：

如果使用了rel属性，则链接元素被限制为头 元素......

因此，您的 HTML5 标记无效，因为链接不应出现在body中，这是应该放在head中的元数据内容。显然 IE 出于某种原因更加宽松（我想这里必须使用某种特定于 IE 的代码来尝试使其符合标准，这恰好接受正文中的链接作为副产品）

于 2013-10-11T07:55:40.697 回答