Google Map未使用XHTML Doctype(文档类型)

Kno*_*ing 8 xhtml doctype google-maps cross-browser

为什么在地球上总是有可能如果我们在Google地图中使用"Doctype",那么在正确显示Google地图时会出现问题?

在最近的一个案例中,这个"Doctype"只花了我2天没有任何生产力.真恶心的情况怎么样?这次我得到了我的同事(Subhankar Bannerjee)的帮助,非常感谢他,因为他及时有效的帮助.他还提到了同样的问题,他曾多次面对这个问题.

任何人都可以告诉我为什么谷歌地图会出现这种Doctype问题?

任何帮助是极大的赞赏.

编辑(评论@Balus): -
我正在使用(X)HTML 1.0 Transitional Doctype,用于Mozilla FF和Google Chrome浏览器.我还没有在IE v6 +中检查过这个谷歌地图,所以我无法对这些浏览器发表评论.

vto*_*nen 16

我之前遇到过与Google Maps API v3相同的问题,我必须说调试并不容易.

这里的问题是,如果您不在页面上使用DOCTYPE,页面将以怪癖模式呈现.基本上,这允许使用样式而无需任何额外的CSS或JavaScript.在这种情况下,您可以使用此位加载地图:

<body onload="initialize()">
  <div id="map_canvas" style="width:100%; height:100%"></div>
</body> 
Run Code Online (Sandbox Code Playgroud)

但是,使用DOCTYPE,页面呈现的方式就像DOCTYPE所说的那样.如果没有任何额外的CSS,设置上面的样式将无法使用百分比.元素没有大小,所以你最终没有任何东西.所以如果你使用的是XHTML 1.0 Strict,即.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml/DTD/xhtml1-strict.dtd">
Run Code Online (Sandbox Code Playgroud)

如果您使用像素而不是百分比,页面将呈现应有的效果:

<body onload="initialize()">
  <div id="map_canvas" style="width:500px; height:400px"></div>
</body> 
Run Code Online (Sandbox Code Playgroud)

你也可以在CSS中做到这一点.

所以你的选择在这里:

  1. 保留DOCTYPE并使用像素而不是百分比通过CSS指定宽度和高度.

  2. 删除DOCTYPE并使用百分比.建议不要这样做,因为文档应该总是说明应该呈现什么DTD.

您可以在此处找到有关Quirks模式的更多信息.还有一个表格,显示了不同的浏览器如何对缺乏DTD做出反应.