W3 失败， <noscript> 嵌套在 DIV 标记中答案

【问题标题】：W3 Failing with <noscript> nested in a DIV tagW3 失败， <noscript> 嵌套在 DIV 标记中
【发布时间】：2011-05-06 23:52:24
【问题描述】：

我的应用程序运行良好，但我希望能够让它在 W3 上完全验证。

我的问题很简单。我正在使用 Bing JS API 将 Bing 地图附加到 Div 标签。在该 Div 标记中，我有一个 <noscript> 元素，如果禁用了 JavaScript，则该元素调用 MultiMap 静态地图提供程序。我选择这样做的原因是，如果我不打算实际使用 MultiMap API，我不想调用它。

是否有其他方法可以做到这一点，以便我可以成为 W3 HTML5 有效？

<div id='bingMap' class="largeMap">
    <noscript>
        <img src="http://developer.multimap.com/API/map/1.2/xxxxxxxxxxxxxxx?zoomFactor=11&amp;width=550&amp;height=400&amp;lat_1=51.18468&amp;lon_1=-114.497999&amp;lat_2=51.169858&amp;lon_2=-114.32549&amp;lat_3=51.083277&amp;lon_3=-114.203964&amp;lat_4=51.063097&amp;lon_4=-114.092031&amp;lat_5=50.939664&amp;lon_5=-113.973568" />
    </noscript>
</div>

【问题讨论】：

不要执着于让每一页都 100% 符合 W3C 验证程序。如果它适用于目标受众的所有浏览器，那么一点点<noscript> 并不是世界末日。
这就是我一直告诉自己的，但我是一个完美主义者，所以它有点困扰我:-P
别听他们的，你的问题很容易解决

标签： html w3c-validation

【解决方案1】：

这也许是：

<html>
<body>
  <script type="text/javascript">
    document.write("<" + "!--");
  </script>
  <p>This will be commented out if scripting is supported.</p>
  <script type="text/javascript">
    document.write("-" + "->");
  </script>
</body>
</html>

【讨论】：

这看起来好像可以工作，但是我更喜欢<span class="cS"></span>This will be commented out<span class="cE"></span> 并使用 jQuery 来注入注释符号。只是看起来比内联脚本块更干净。
这行不通，因为 jQuery 在加载 DOM 之前不会运行，到那时 multimap 将被引用。这就是我选择在创建 DOM 时运行脚本的原因。
酷我已经使用了这个解决方案。只有一个人怀疑你为什么要连接“

【解决方案2】：

将<img/> 包装到 div、p 或其他块元素中。 <noscript> 只允许将块元素作为直接子元素。

<div id='bingMap' class="largeMap">
    <noscript>
        <div>
            <img src="....." />
        </div>
    </noscript>
</div>

【讨论】：

img 标签也需要一个alt来验证
我希望你是对的，但错误实际上是说 XHTML element noscript not allowed as child of XHTML element div in this context（是我测试过。）
很奇怪，当我将它放入验证器时，它通过了。我将在一秒钟内发布示例代码作为答案

【解决方案3】：

我建议删除 xmlns 以防止它将您的代码解释为 XHTML5（而不是 HTML5），因为 XHTML5 只是 HTML5 的更严格版本，不允许许多功能。 HTML5 仍然支持 XHTML 样式的标签，所以不会丢失。

类似下面的方法会起作用：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>title</title>
  </head>
  <body>
    <div id="bingMap" class="largeMap">
      <noscript>
        <img alt="" src="http://developer.multimap.com/API/map/1.2/xxxxxxxxxxxxxxx?zoomFactor=11&amp;width=550&amp;height=400&amp;lat_1=51.18468&amp;lon_1=-114.497999&amp;lat_2=51.169858&amp;lon_2=-114.32549&amp;lat_3=51.083277&amp;lon_3=-114.203964&amp;lat_4=51.063097&amp;lon_4=-114.092031&amp;lat_5=50.939664&amp;lon_5=-113.973568" />
      </noscript>
    </div>
  </body>
</html>

【讨论】：

【解决方案4】：

以下内容在http://validator.w3.org/check为我验证

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC
  "-//W3C//DTD XHTML 1.1//EN"
  "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<title>title</title>
    <meta http-equiv="content-type" 
        content="text/html;charset=utf-8" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
</head>
<body>

<div id='bingMap' class="largeMap">
    <noscript>
      <div>
        <img alt="" src="http://developer.multimap.com/API/map/1.2/xxxxxxxxxxxxxxx?zoomFactor=11&amp;width=550&amp;height=400&amp;lat_1=51.18468&amp;lon_1=-114.497999&amp;lat_2=51.169858&amp;lon_2=-114.32549&amp;lat_3=51.083277&amp;lon_3=-114.203964&amp;lat_4=51.063097&amp;lon_4=-114.092031&amp;lat_5=50.939664&amp;lon_5=-113.973568" />
      </div>
    </noscript>
</div>

</body>
</html>

【讨论】：

然而，我是用 HTML5 构建的，所以虽然你的是有效的......由于某种原因，我的不是。
你原来的问题说 xhtml >
对不起，一定是打字太快了，没有仔细注意。我更正了。