HTML 基础

HTML 基础

1.
微信小程序 bindtap 和 catchtap 的区别

微信小程序中两种点击事件的事件冒泡处理差异

2.
Bootstrap 徽章

使用 Bootstrap 创建徽章组件的方法

3.
Bootstrap 按钮下拉菜单

使用 Bootstrap 创建按钮下拉菜单的方法

4.
Bootstrap 按钮组

Bootstrap 按钮组的创建方法及水平与垂直按钮组的优先级

5.
Bootstrap 按钮激活与禁用

Bootstrap 中按钮状态的控制方法

6.
Bootstrap 文档类型声明

Bootstrap 需要的 DOCTYPE 声明及其原因

7.
Bootstrap 下拉菜单

使用 Bootstrap 创建下拉菜单的方法和示例

8.
Bootstrap 表单帮助文本

使用 Bootstrap 为表单控件添加帮助提示文本

9.
Bootstrap 水平表单

使用 Bootstrap 创建水平布局表单的方法

10.
Bootstrap 输入框组

使用 Bootstrap 创建带前缀、后缀的输入框组

11.
Bootstrap 超大屏幕

Bootstrap Jumbotron 组件的作用和使用方法

12.
Bootstrap 标签

Bootstrap 中显示标签的 class 用法

13.
Bootstrap 导航类型

Bootstrap 中常用的导航组件及使用方法

14.
Bootstrap 分页

Bootstrap 中分页组件的 class 用法

15.
Bootstrap 响应式表格

使用 Bootstrap 创建响应式表格的方法

16.
Bootstrap 垂直表单创建

使用 Bootstrap 创建垂直表单的基本步骤和代码示例

17.
浏览器乱码问题及解决方案

分析浏览器显示乱码的常见原因和对应的解决方法

18.
Canvas 标签属性与 CSS 样式设置宽高的区别

Canvas 的 width/height 属性与 style 样式设置宽高的本质区别

19.
Canvas、SVG、WebGL 对比

三种浏览器图形技术的区别和使用场景

20.
网页验证码的作用

验证码的用途、常见类型及前端实现方式

21.
前端跨页面通信方法

实现不同页面间数据传递和通信的多种方案

22.
圆形可点击区域实现

使用 CSS、map area 和 JavaScript 实现圆形点击区域

23.
浏览器多标签页通信方案

实现同源标签页之间数据通信的多种方法

24.
CSSOM 树和 DOM 树的解析时机

浏览器解析 DOM 和 CSSOM 的过程,以及 JavaScript 对解析的影响

25.
设备的 DPR 是否可变

理解设备像素比(DPR)的概念及其变化原因

26.
禁用 a 标签的跳转和定位

通过 href 属性、事件处理和 CSS 样式三种方式禁用 a 标签的默认行为

27.
DOM 和 BOM 的区别

理解 JavaScript 中的文档对象模型和浏览器对象模型

28.
DOM 发展历程

DOM 从 Level 0 到 Living Standard 的演进过程

29.
DOCTYPE 与文档模式

DOCTYPE 声明的作用及严格模式与混杂模式的区别

30.
DNS 预解析优化网页加载速度

使用 dns-prefetch 提前解析域名,减少 DNS 查询延迟

31.
DOM 树的理解

DOM 树的概念、生成过程及 JavaScript 对其的影响

32.
Drag API 拖拽事件

HTML5 Drag API 的 7 个拖拽事件及使用方法

33.
前端 SEO 优化要点

前端开发中需要注意的 SEO 优化技巧

34.
标题与副标题的实现

HTML 中在标题旁边添加副标题的几种方法

35.
HTML 元素分类

行内元素、块级元素、空元素的区别与常见标签

36.
HTML 全局属性

常用 HTML 全局属性的用法与场景

37.
HTML 页面渲染过程

浏览器如何将 HTML、CSS 解析并渲染成可视化页面

38.
HTML 语义化

理解 HTML 语义化标签及其对 SEO 和可读性的作用

39.
HTML 语义化

理解 HTML 语义化的概念、作用和优势

40.
HTML5 DOCTYPE 声明简化原因

为什么 HTML5 只需要写 <!DOCTYPE html>

41.
HTML5 离线存储原理与使用

使用 Service Worker 和 Cache API 实现网页离线访问

42.
HTML5 新特性

HTML5 常用新特性及使用示例

43.
HTML5 移除的元素

HTML5 废弃的元素及其替代方案

44.
IconFont 字体图标

IconFont 的概念、优势和局限性

45.
iframe 的优缺点与通信

iframe 的使用场景、优缺点分析及跨域通信方案

46.
图片点击下载而非预览

实现点击图片链接触发下载,而不是在浏览器中打开预览

47.
HTML 和 CSS 中的图片加载与渲染规则

浏览器如何加载和渲染 img、picture 和 background-image

48.
浏览器预览待上传图片

使用 URL.createObjectURL 和 FileReader 实现图片上传前预览

49.
img 标签 title 和 alt 的区别

了解 img 标签中 title 和 alt 属性的不同用途

50.
input 标签触发拍照功能

使用 capture 属性让文件上传控件直接调用设备摄像头

51.
控制 input 输入框字数

使用 maxlength 属性和 oninput 事件限制输入框字数

52.
img 的 srcset 属性

使用 srcset 和 sizes 实现响应式图片加载

53.
禁止 input 显示历史记录

使用 autocomplete 属性关闭输入框的自动完成功能

54.
input 上传多个文件

使用 multiple 属性实现文件多选上传

55.
JS 和 CSS 对 DOM 树构建的影响

分析 JavaScript 和 CSS 如何阻塞 DOM 解析和渲染过程

56.
label 标签的作用

使用 label 标签关联表单控件,提升表单可用性

57.
link 和 @import 的区别

页面导入样式时,link 和 @import 的差异对比

58.
Meta 标签常用属性

HTML Meta 标签的 Viewport、Charset、Keywords、Description 等属性用法

59.
Meta 标签自动刷新跳转

使用 meta 标签实现页面自动刷新和跳转

60.
小程序的双线程架构

小程序渲染线程和逻辑线程的职责与协作机制

61.
小程序页面间传递数据的方法

小程序中实现页面间数据传递的 5 种方式

62.
小程序为什么没有 DOM API

解释小程序不提供 DOM 操作 API 的原因和替代方案

63.
微信小程序的优劣势

分析微信小程序的优势和劣势,帮助开发者了解其特点和限制

64.
Node 和 Element 的关系

理解 DOM 中 Node 和 Element 的继承关系与区别

65.
页面生命周期事件:DOMContentLoaded、load、beforeunload、unload

理解 HTML 页面的四个关键生命周期事件及其使用场景

66.
渐进增强与优雅降级

两种 Web 开发策略的区别与实践

67.
渐进式 JPEG 图片格式

渐进式 JPEG 的加载方式和应用场景

68.
PV 和 UV 的区别

页面统计中 PV(页面访问量)和 UV(独立访客)的定义和计算方式

69.
Script 标签 defer 和 async

script 标签的 defer 和 async 属性区别及使用场景

70.
实现点击回到顶部功能

5 种实现页面回到顶部的方法:锚点、scrollTop、scrollTo、scrollBy 和 scrollIntoView

71.
script 标签能否使用自闭合语法

解释为什么 script 标签不能使用自闭合写法

72.
src 与 href 的区别

HTML 中 src 和 href 属性的用途和行为差异

73.
SSG 静态网站生成

理解 SSG 的工作原理、实现流程和适用场景

74.
style 标签位置对页面渲染的影响

style 标签放在 body 前后的区别及 FOUC 问题

75.
从输入 URL 到页面显示的过程

浏览器加载页面的完整流程,包括 DNS 解析、TCP 连接、HTTP 请求和页面渲染

76.
Web 标准与可访问性理解

理解 Web 标准、可用性、可访问性的概念与实践

77.
网页常用图片格式

网页开发中常见图片格式的特点和使用场景

78.
网页常用图片格式

前端开发中常见图片格式的特点和使用场景

79.
Web 标准与 W3C 标准

了解 Web 标准的组成和 W3C 的作用

80.
WebSocket 低版本浏览器兼容方案

在不支持 WebSocket 的浏览器中实现实时通信的降级方案

81.
Web Worker 的作用与场景

Web Worker 实现多线程及其使用场景

82.
微信小程序事件传值

小程序中通过事件传递数据的几种方式

83.
微信小程序文件结构

微信小程序的文件组成和作用

84.
微信小程序的架构

微信小程序的双线程架构和核心组成部分

85.
微信小程序原理

微信小程序的架构设计和运行机制

86.
页面白屏时间优化

分析页面白屏的原因和优化方案

87.
小程序 WXSS 与 CSS 的区别

小程序样式 WXSS 与标准 CSS 的主要差异

88.
XHTML 与 HTML 的区别

XHTML 和 HTML 在语法规则上的主要差异