# 基础篇

前端基础题型，快速过一遍即可

面试经验谈

# 一、HTML、HTTP、WEB综合问题

# 1 前端需要注意哪些SEO

合理的title、description、keywords：搜索引擎对这些标签的权重逐渐减小。在title中，强调重点即可，重要关键词不要超过2次，并且要靠前。每个页面的title应该有所不同。description应该高度概括页面内容，长度适当，避免过度堆砌关键词。每个页面的description也应该有所不同。keywords标签应列举出重要关键词即可。
- 针对title标签，可以使用重要关键词、品牌词或描述页面内容的短语。确保标题简洁、准确地概括页面的主题，并吸引用户点击。
- 在编写description标签时，应尽量使用简洁、具有吸引力的语句来概括页面的内容，吸引用户点击搜索结果。避免堆砌关键词，以自然流畅的方式描述页面
- keywords标签已经不再是搜索引擎排名的重要因素，但仍然可以列举出与页面内容相关的几个重要关键词，以便搜索引擎了解页面的主题。
语义化的HTML代码，符合W3C规范：使用语义化的HTML代码可以让搜索引擎更容易理解网页的结构和内容。遵循W3C规范可以提高网页的可读性和可访问性，对SEO也有好处。
重要内容HTML代码放在最前：搜索引擎抓取HTML的顺序是从上到下，有些搜索引擎对抓取长度有限制。因此，将重要的内容放在HTML的前面，确保重要内容一定会被抓取。
重要内容不要用js输出：爬虫不会执行JavaScript，所以重要的内容不应该依赖于通过JavaScript动态生成。确保重要内容在HTML中静态存在。
少用iframe：搜索引擎通常不会抓取iframe中的内容，因此应该尽量减少iframe的使用，特别是对于重要的内容。
非装饰性图片必须加alt：为非装饰性图片添加alt属性，可以为搜索引擎提供关于图片内容的描述，同时也有助于可访问性。
提高网站速度：网站速度是搜索引擎排序的一个重要指标

# 2 `<img>`的`title`和`alt`有什么区别

title属性：title属性是HTML元素通用的属性，适用于各种元素，不仅仅是<img>标签。当鼠标滑动到元素上时，浏览器会显示title属性的内容，提供额外的信息或解释，帮助用户了解元素的用途或含义。对于<img>标签，鼠标悬停在图片上时会显示title属性的内容。
alt属性：alt属性是<img>标签的特有属性，用于提供图片的替代文本描述。当图片无法加载时，浏览器会显示alt属性的内容，或者在可访问性场景中，读屏器会读取alt属性的内容。alt属性的主要目的是提高图片的可访问性，使无法查看图片的用户也能了解图片的内容或含义。除了纯装饰性图片外，所有<img>标签都应该设置有意义的alt属性值。
补充答案：
- title属性主要用于提供额外的信息或提示，是对图片的补充描述，可以用于提供更详细的说明，如图片的来源、作者、相关信息等。它不是必需的，但可以增强用户体验，特别是在需要显示更多信息时。
- alt属性是图片内容的等价描述，应该简洁明了地描述图片所表达的信息。它对于可访问性至关重要，确保无障碍用户能够理解图片的含义，同时也是搜索引擎重点分析的内容。在设置alt属性时，应该避免过度堆砌关键词，而是提供准确、有意义的描述。

# 3 HTTP的几种请求方法用途

GET方法：
- 用途：发送一个请求来获取服务器上的某一资源。
- 面试可能涉及的问题：
  1. GET方法的特点是什么？
    - GET方法是HTTP的一种请求方法，用于从服务器获取资源。
    - 它是一种幂等的方法，多次发送相同的GET请求会返回相同的结果。
  2. GET请求和POST请求的区别是什么？
    - GET请求将参数附加在URL的查询字符串中，而POST请求将参数放在请求体中。
    - GET请求的数据会显示在URL中，而POST请求的数据不会显示在URL中。
    - GET请求一般用于获取数据，而POST请求一般用于提交数据。
  3. GET请求可以有请求体吗？
    - 根据HTTP规范，GET请求不应该有请求体，参数应该通过URL的查询字符串传递。
  4. GET请求的参数如何传递？
    - GET请求的参数可以通过URL的查询字符串传递，例如：/api/users?id=123&name=poetry。
  5. GET请求的安全性和幂等性如何保证？
    - GET请求不会对服务器端的资源产生副作用，因此被视为安全的。
    - GET请求是幂等的，多次发送相同的GET请求不会对服务器端产生影响。
POST方法：
- 用途：向URL指定的资源提交数据或附加新的数据。
- 面试可能涉及的问题：
  1. POST方法的特点是什么？
    - POST方法是HTTP的一种请求方法，用于向服务器提交数据。
    - 它不是幂等的，多次发送相同的POST请求可能会产生不同的结果。
  2. POST请求和GET请求的区别是什么？
    - POST请求将参数放在请求体中，而GET请求将参数附加在URL的查询字符串中。
    - POST请求的数据不会显示在URL中，而GET请求的数据会显示在URL中。
    - POST请求一般用于提交数据，而GET请求一般用于获取数据。
  3. POST请求的请求体如何传递数据？
    - POST请求的数据可以通过请求体以表单形式传递，或者以JSON等格式传递。
  4. POST请求的安全性和幂等性如何保证？
    - POST请求可能对服务器端的资源产生副作用，因此被视为不安全的。
    - POST请求不是幂等的，多次发送相同的POST请求可能会对服务器端产生影响。
PUT方法：
- 用途：将数据发送给服务器，并将其存储在指定的URL位置。与POST方法不同的是，PUT方法指定了资源在服务器上的位置。
- 面试可能涉及的问题：
  - PUT方法的特点是什么？
    - PUT方法是HTTP的一种请求方法，用于将数据发送给服务器并存储在指定的URL位置。
    - 它是一种幂等的方法，多次发送相同的PUT请求会对服务器端产生相同的结果。
  - PUT请求和POST请求有什么区别？
    - PUT请求用于指定资源在服务器上的位置，而POST请求没有指定位置。
    - PUT请求一般用于更新或替换资源，而POST请求一般用于新增资源或提交数据。
  - PUT请求的幂等性如何保证？
    - PUT请求的幂等性保证是由服务器端实现的。
    - 服务器端应该根据请求中的资源位置来处理请求，多次发送相同的PUT请求会对该位置上的资源进行相同的更新或替换操作。
HEAD方法
- 只请求页面的首部
DELETE方法
- 删除服务器上的某资源
OPTIONS方法
- 它用于获取当前URL所支持的方法。如果请求成功，会有一个Allow

`# 基础篇`



前端基础题型，快速过一遍即可



# 一、HTML、HTTP、WEB综合问题
# 1 前端需要注意哪些SEO

合理的title、description、keywords：搜索引擎对这些标签的权重逐渐减小。在title中，强调重点即可，重要关键词不要超过2次，并且要靠前。每个页面的title应该有所不同。description应该高度概括页面内容，长度适当，避免过度堆砌关键词。每个页面的description也应该有所不同。keywords标签应列举出重要关键词即可。

针对title标签，可以使用重要关键词、品牌词或描述页面内容的短语。确保标题简洁、准确地概括页面的主题，并吸引用户点击。
在编写description标签时，应尽量使用简洁、具有吸引力的语句来概括页面的内容，吸引用户点击搜索结果。避免堆砌关键词，以自然流畅的方式描述页面
keywords标签已经不再是搜索引擎排名的重要因素，但仍然可以列举出与页面内容相关的几个重要关键词，以便搜索引擎了解页面的主题。


语义化的HTML代码，符合W3C规范：使用语义化的HTML代码可以让搜索引擎更容易理解网页的结构和内容。遵循W3C规范可以提高网页的可读性和可访问性，对SEO也有好处。
重要内容HTML代码放在最前：搜索引擎抓取HTML的顺序是从上到下，有些搜索引擎对抓取长度有限制。因此，将重要的内容放在HTML的前面，确保重要内容一定会被抓取。
重要内容不要用js输出：爬虫不会执行JavaScript，所以重要的内容不应该依赖于通过JavaScript动态生成。确保重要内容在HTML中静态存在。
少用iframe：搜索引擎通常不会抓取iframe中的内容，因此应该尽量减少iframe的使用，特别是对于重要的内容。
非装饰性图片必须加alt：为非装饰性图片添加alt属性，可以为搜索引擎提供关于图片内容的描述，同时也有助于可访问性。
提高网站速度：网站速度是搜索引擎排序的一个重要指标

# 2 <img>的title和alt有什么区别


title属性：title属性是HTML元素通用的属性，适用于各种元素，不仅仅是<img>标签。当鼠标滑动到元素上时，浏览器会显示title属性的内容，提供额外的信息或解释，帮助用户了解元素的用途或含义。对于<img>标签，鼠标悬停在图片上时会显示title属性的内容。


alt属性：alt属性是<img>标签的特有属性，用于提供图片的替代文本描述。当图片无法加载时，浏览器会显示alt属性的内容，或者在可访问性场景中，读屏器会读取alt属性的内容。alt属性的主要目的是提高图片的可访问性，使无法查看图片的用户也能了解图片的内容或含义。除了纯装饰性图片外，所有<img>标签都应该设置有意义的alt属性值。


补充答案：

title属性主要用于提供额外的信息或提示，是对图片的补充描述，可以用于提供更详细的说明，如图片的来源、作者、相关信息等。它不是必需的，但可以增强用户体验，特别是在需要显示更多信息时。
alt属性是图片内容的等价描述，应该简洁明了地描述图片所表达的信息。它对于可访问性至关重要，确保无障碍用户能够理解图片的含义，同时也是搜索引擎重点分析的内容。在设置alt属性时，应该避免过度堆砌关键词，而是提供准确、有意义的描述。



# 3 HTTP的几种请求方法用途

GET方法：

用途：发送一个请求来获取服务器上的某一资源。
面试可能涉及的问题：

GET方法的特点是什么？

GET方法是HTTP的一种请求方法，用于从服务器获取资源。
它是一种幂等的方法，多次发送相同的GET请求会返回相同的结果。


GET请求和POST请求的区别是什么？

GET请求将参数附加在URL的查询字符串中，而POST请求将参数放在请求体中。
GET请求的数据会显示在URL中，而POST请求的数据不会显示在URL中。
GET请求一般用于获取数据，而POST请求一般用于提交数据。


GET请求可以有请求体吗？

根据HTTP规范，GET请求不应该有请求体，参数应该通过URL的查询字符串传递。


GET请求的参数如何传递？

GET请求的参数可以通过URL的查询字符串传递，例如：/api/users?id=123&name=poetry。


GET请求的安全性和幂等性如何保证？

GET请求不会对服务器端的资源产生副作用，因此被视为安全的。
GET请求是幂等的，多次发送相同的GET请求不会对服务器端产生影响。






POST方法：

用途：向URL指定的资源提交数据或附加新的数据。
面试可能涉及的问题：

POST方法的特点是什么？

POST方法是HTTP的一种请求方法，用于向服务器提交数据。
它不是幂等的，多次发送相同的POST请求可能会产生不同的结果。


POST请求和GET请求的区别是什么？

POST请求将参数放在请求体中，而GET请求将参数附加在URL的查询字符串中。
POST请求的数据不会显示在URL中，而GET请求的数据会显示在URL中。
POST请求一般用于提交数据，而GET请求一般用于获取数据。


POST请求的请求体如何传递数据？

POST请求的数据可以通过请求体以表单形式传递，或者以JSON等格式传递。


POST请求的安全性和幂等性如何保证？

POST请求可能对服务器端的资源产生副作用，因此被视为不安全的。
POST请求不是幂等的，多次发送相同的POST请求可能会对服务器端产生影响。






PUT方法：

用途：将数据发送给服务器，并将其存储在指定的URL位置。与POST方法不同的是，PUT方法指定了资源在服务器上的位置。
面试可能涉及的问题：

PUT方法的特点是什么？

PUT方法是HTTP的一种请求方法，用于将数据发送给服务器并存储在指定的URL位置。
它是一种幂等的方法，多次发送相同的PUT请求会对服务器端产生相同的结果。


PUT请求和POST请求有什么区别？

PUT请求用于指定资源在服务器上的位置，而POST请求没有指定位置。
PUT请求一般用于更新或替换资源，而POST请求一般用于新增资源或提交数据。


PUT请求的幂等性如何保证？

PUT请求的幂等性保证是由服务器端实现的。
服务器端应该根据请求中的资源位置来处理请求，多次发送相同的PUT请求会对该位置上的资源进行相同的更新或替换操作。






HEAD方法

只请求页面的首部


DELETE方法

删除服务器上的某资源


OPTIONS方法

它用于获取当前URL所支持的方法。如果请求成功，会有一个Allow