用jquery更改视口元标记

AB.*_*AB. 2 html javascript css jquery media-queries

我想知道是否可以在页面加载之前使用jquery将元标记添加到html页面.我问的原因是因为我有一个没有视口元标记的页面,只有当分辨率低于700px时它才应该有 - <meta name="viewport" content="width=device-width, initial-scale=1"/>

原因是,我有移动网站的html标记(使用媒体查询)以及桌面版的html标记(我没有平板电脑的标记).我想确保为桌面设计的html标记在页面加载时以及在我们更改设备方向时在平板电脑上正确呈现.

提前致谢!

And*_*mes 7

使用jQuery,你可以像下面这样做:

if ($(window).width() < 700) {
   $('head').append('<meta name="viewport" content="width=device-width, initial-scale=1"/>');
}
Run Code Online (Sandbox Code Playgroud)

编辑

要默认使用视口标记,请将其删除到699px以上:

HTML:

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
</head>
Run Code Online (Sandbox Code Playgroud)

jQuery的:

if ($(window).width() > 699) {
   $('head').remove('<meta name="viewport" content="width=device-width, initial-scale=1"/>');
}
Run Code Online (Sandbox Code Playgroud)