javascript - 元标记名称视口(viewport)不起作用

Question

我正在尝试使用元标记名称视口(viewport)来使网站适合移动设备。

我尝试了以下语法，但似乎不起作用:

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">

当我从使用不同样式引号的网站复制该行时，它一度起作用。 (不记得是哪个网站了) 关闭编辑器并重新打开编辑器我注意到末尾的引号变成了问号，如下所示

<meta  name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0 ?>

最初使用问号工作时没有任何问题，但是第二天，当我从 FTP 重新打开文档并重新加载页面时，我注意到它不再使用问号工作。

我不知道我在哪里复制了最初使用不同样式引号的初始元标记视口(viewport)命令，以测试它是否仍然有效。

任何人都可以提供建议，为什么这可能不起作用以及我如何对其进行故障排除以使其正常工作？

我还希望能够让以下代码 Javascript 代码正常工作，但我无法正常工作。如果对此也有任何建议，那就太好了

$('head').append('<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">');

附加信息 发现 Firebug 是一个故障排除工具。查看了 firebug 给出的代码。 Firebug 似乎已将元标记名称视口(viewport)行更改为

<meta content-type"="" content="initial-scale=1, maximum-scale=1, user-scalable=0? > <meta http-equiv=" name="viewport">

Answer 1

我将在这里解决两个问题。

首先是代码中的问号。我敢打赌，这是因为有人不小心用“智能引号”格式化了他们的博客文章，因此最终的引号字符变成了 Unicode 结束双引号引号字符，最终呈现为 ?因为某处的编码冲突。基本上，用正确的双引号重新输入即可修复它。

其次，正如Adrian在推荐中所说，使用JS在加载后动态添加元标记不太可能起作用。浏览器在读取初始内容流时会查找此关键信息，类似于检查页面编码和文档类型。

给您的一个额外说明:在您当前的主页 www.ictlds.co.uk 上，您的元描述和关键字有非法的结束标签。元标记是自动关闭的，因此您不得添加结束标记。通过 W3C 验证器服务运行您的页面。