前端面试题每日一学_7

努力的小朱同学

已于 2024-11-21 10:30:03 修改

阅读量781

点赞数 12

分类专栏：前端每日一学（1~12）文章标签：前端面试 HTML

于 2024-11-21 10:27:56 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_45092437/article/details/143875925

版权

前端每日一学（1~12）专栏收录该内容

12 篇文章

订阅专栏

今日一题：

下面能够校验字符串是否完全由字母、数字、下划线组成的正则表达式是？（多选题）

A、^[a-zA-Z0-9_]+$
B、^\w+$
C、^(?:[a-zA-Z0-9_]+)$
D、^[a-zA-Z0-9_]$

答案和解析可在文章底部查看。

今日面试题：

1、HTML中meta标签的相关设置有哪些？

① 字符编码设置

<!-- 声明当前文档的字符编码 -->
<meta charset='utf-8'>

② 视口设置

<!-- 声明当前页面的视口设置 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=2.0,user-scalable=yes">

其中width用于设置视口宽度，值可以是一个正整数，或者device-width（设备宽度）；initial-scale用于设置初始缩放比例，值为一个数字，可以带小数；minimum-scale用于设置用户手动缩放的最小缩放比例，值为一个数字，可以带小数；maximum-scale用于设置用户手动缩放的最大缩放比例，值为一个数字，可以带小数；user-scalable=yes用于设置是否允许用户手动缩放，值为yes/no。

③ 关键词设置

<!-- 声明当前页面的关键词，用于SEO -->
<meta name="keywords" content="语文, 数学, 英语">

④ 描述设置

<!-- 声明当前页面的描述，用于SEO -->
<meta name="description" content="这是一个实验页面">

⑤ 作者设置

<!-- 声明当前页面的作者 -->
<meta name="author" content="前端生活圈">

⑥ IE兼容设置

<!-- 声明当前页面的在IE中的兼容设置 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>

上面的设置中，IE=edge用于设置IE浏览器使用最新的渲染引擎。为确保该标签在页面内容加载之前生效，要将该标签放在<head>标签的最前面。

⑦ 搜索引擎设置

<!-- 声明当前页面对搜索引擎的设置 -->
<meta name="robots" content="noindex, nofollow">

在上面的设置中，name="robots"表明该标签时为搜索引擎爬虫提供指令；content提供具体指令，noindex用于设置搜索引擎不要索引当前页面，即不要将当前页面包含在搜索引擎的索引中。nofollow用于设置搜索引擎不要跟踪页面上的链接，即不要将页面上的链接进行索引。

noindex的相反设置为index，nofollow的相反设置为follow，index和follow是页面的默认设置，noindex和nofollow会影响页面的SEO，要慎重使用。

⑧ 刷新或重定向设置

<!-- 声明当前页面在指定时间后自动刷新 -->
<meta http-equiv="refresh" content="30">
<!-- 声明当前页面在指定时间后自动重定向 -->
<meta http-equiv="refresh" content="30; url=https://www.baidu.com">

在上面的设置中，content="n"用于设置页面在n秒之后自动刷新；content="n; url=pageUrl"用于设置页面在n秒之后自动重定向到 pageUrl 这个地址。

⑨ 缓存设置

<!-- 声明当前页面的缓存机制 -->
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="pragma" content="no-cache">

在上面的设置中，http-equiv="pragma"已经被http-equiv="cache-control"所取代，但为了兼容旧版本浏览器，通常我们两者会同时设置。content设置具体的缓存机制，no-cache表示在使用缓存之前，必须向服务器进行请求验证，保证访问页面时获取的是最新的内容。

除no-cache之外，还可以设置为：no-cache表示完全禁用缓存；max-age=<seconds>表示设置资源的缓存时间为seconds；public表示资源可以被任意一级缓存存储；private表示资源只能被用户缓存，不能被共享区域缓存（如：代理服务器）；must-revalidate表示在资源过期后，必须向服务器验证资源的有效性；其他属性。