蓝桥杯 web 知识点集合
https://i-blog.csdnimg.cn/direct/61501952e8274357940a42e1a0bf2bf4.pngHTML+CSS
[*]HTML 基础标签:包括<html>、<head>、<body>等基础标签,用于构建网页的基本结构。
[*]HTML5 新特性:新增语义化标签(如<header>、<footer>)、多媒体支持(<video>、<audio>)、增强型表单元素等。
[*]HTML5 本地存储:使用localStorage和sessionStorage在客户端持久化或临时保存数据。
[*]CSS 基础语法:选择器、属性、值,如何应用样式到HTML文档中。
[*]盒子模子:明确margin、border、padding和content四个部门对结构的影响。
[*]浮动与定位:使用float、position属性举行页面结构控制。
[*]CSS3 新特性:圆角、阴影、渐变配景、过渡结果、动画等。
[*]弹性盒子:使用Flexbox举行高效灵活的结构筹划。
[*]媒体查询:响应式筹划的基础,根据设备特征应用差异的样式。
JavaScript
[*]JavaScript 基础语法:变量声明、条件语句、循环、函数界说等基本概念。
[*]DOM 与 BOM:操作文档对象模子(DOM)和欣赏器对象模子(BOM),实现动态交互。
[*]JavaScript 内置对象:如Date、Math、Array等对象的使用方法。
[*]JavaScript 事件:监听用户交互(点击、输入等),并作出相应处理。
[*]JavaScript AJAX:通过异步请求获取或发送数据,无需革新整个页面。
[*]正则表达式:匹配字符串模式的强大工具,常用于验证输入格式。
Axios
[*]Axios 基础语法:一个基于Promise的HTTP客户端,用于欣赏器和node.js中发起请求。
ES6
[*]let 和 const 下令:块级作用域变量声明方式。
[*]class:面向对象编程中的类界说。
[*]set 和 map:ES6引入的数据结构,提供更丰富的集合操作。
[*]Proxy:用于创建署理对象,拦截并自界说基本操作。
[*]字符串、函数、数组和对象的扩展:ES6对这些范例提供的新方法和功能。
[*]异步编程与模块化:async/await简化异步代码编写,ES6模块化系统构造代码。
Vue.js
[*]Vue 焦点:Vue框架的焦点概念,如响应式数据绑定、组件化开发。
[*]Vue 组件:创建可复用的界面组件。
[*]vue-router:Vue官方路由管理工具,支持SPA应用导航。
ElementPlus
[*]基础组件:如按钮(Button)、输入框(Input)等常用UI组件。
[*]表单和表格组件:用于快速搭建表单和展示数据。
[*]弹出组件:如对话框(Dialog)、消息提示(Message)等。
[*]导航组件:侧边栏(Sidebar)、面包屑(Breadcrumb)等导航元素。
ECharts
[*]ECharts 基础语法:配置项和数据接口的基本使用。
[*]ECharts 绘制图表:绘制柱状图、折线图等多种图表范例。
[*]ECharts 异步数据加载和更新:处理动态数据展示。
[*]ECharts 交互组件:添加交互功能,如缩放、拖拽等。
[*]ECharts 事件处理:监听图表上的各种事件。
Node.js
[*]Node.js 基础:相识Node.js环境及运行原理。
[*]内置模块使用:如fs(文件系统)、http(网络服务)等焦点模块的应用。
Pinia
[*]Pinia 焦点:作为Vue的状态管理库,更换Vuex的新选择,提供简便的状态管理模式。
旋转
动画
grid
flex
2.CSS3
(7)CSS 基础语法
[*]选择器:类选择器(.class)、ID选择器(#id)、标签选择器(tag)。
[*]属性与值:如color: red;、font-size: 16px;。
[*]优先级:内联样式 > ID选择器 > 类选择器 > 标签选择器。
(8)盒子模子
[*]组成:
[*]content:现实内容区域。
[*]padding:内边距。
[*]border:边框。
[*]margin:外边距。
[*]盘算宽度:总宽度 = 内容宽度 + 内边距 + 边框 + 外边距。
(9)浮动与定位
[*]浮动:float: left/right;,常用于结构。
[*]定位:
[*]static:默认值。
[*]relative:相对定位。
[*]absolute:绝对定位。
[*]fixed:固定定位。
(10)CSS3 新特性
[*]渐变:线性渐变(linear-gradient)、径向渐变(radial-gradient)。
[*]阴影:box-shadow、text-shadow。
[*]动画:@keyframes界说动画,animation应用动画。
(11)弹性盒子
[*]焦点概念:Flexbox是一种高效的结构方式。
[*]容器属性:
[*]display: flex;
[*]flex-direction、justify-content、align-items。
[*]子项属性:
[*]flex-grow、flex-shrink、flex-basis。
(12)媒体查询
[*]语法: @media (max-width: 768px) {
body { font-size: 14px; }
}
[*]用途:根据屏幕尺寸调整样式,实现响应式筹划。
3. JavaScript
(7)JavaScript 基础语法
[*]变量声明:var、let、const。
[*]条件语句:if、else if、switch。
[*]循环:for、while、do...while。
[*]函数:function关键字。
(8)DOM 与 BOM
[*]DOM:操作文档对象模子,如document.getElementById()。
[*]BOM:操作欣赏器对象模子,如window.alert()、location.href。
(9)JavaScript 内置对象
[*]Date:处理日期和时间。
[*]Math:数学运算(如Math.random())。
[*]Array:数组操作(如push()、pop())。
(10)JavaScript 事件
[*]常见事件:
[*]点击事件:click。
[*]输入事件:input、change。
[*]鼠标事件:mouseover、mouseout。
[*]事件绑定:addEventListener()。
(11)JavaScript AJAX
[*]XMLHttpRequest:传统的AJAX请求方式。
[*]Fetch API:现代异步请求方式。
[*]跨域题目:CORS、JSONP。
(12)正则表达式
[*]语法:/pattern/flags。
[*]方法:
[*]test():测试字符串是否匹配。
[*]match():提取匹配结果。
[*]应用场景:表单验证、字符串剖析。
4. ES6
(7)let 和 const 下令
[*]let:块级作用域变量。
[*]const:常量,不可重新赋值。
(8)class
[*]界说类: class Person {
constructor(name) {
this.name = name;
}
greet() {
console.log(`Hello, ${this.name}`);
}
}
(9)set 和 map
[*]Set:集合,元素唯一。
[*]Map:键值对集合。
(10)Proxy
[*]拦截操作: const handler = {
get(target, key) {
return key in target ? target : "Not Found";
}
};
const proxy = new Proxy({}, handler);
(11)字符串、函数、数组和对象的扩展
[*]字符串:模板字符串(`Hello ${name}`)。
[*]数组:map()、filter()、reduce()。
(12)异步编程与模块化
[*]异步:async/await。
[*]模块化:import/export。
5. Axios
(6)Axios API
[*]发起GET、POST请求: axios.get('/api/data').then(response => console.log(response.data));
(7)Axios 实例
[*]创建实例: const instance = axios.create({ baseURL: 'https://api.example.com' });
(8)请求配置
[*]设置超时时间、请求头等。
(9)默认配置
[*]全局默认配置: axios.defaults.baseURL = 'https://api.example.com';
(10)拦截器
[*]请求和响应拦截: axios.interceptors.request.use(config => config);
6. Vue.js
(1)Vue 焦点语法
[*]数据绑定:v-bind、v-model。
[*]指令:v-if、v-for。
(2)Vue 组件化开发
[*]界说组件: Vue.component('my-component', { template: '<div>Hello</div>' });
(3)vue-router(v4.x)
[*]路由配置: const routes = [{ path: '/', component: Home }];
const router = VueRouter.createRouter({ routes });
(4)pinia 使用
[*]状态管理: const store = defineStore('main', { state: () => ({ count: 0 }) });
7. ElementPlus
(1)基础组件的使用
[*]按钮、输入框等。
(2)表单和表格组件
[*]表单验证、分页表格。
(3)反馈组件
[*]对话框、提示框。
(4)导航组件
[*]菜单、面包屑。
(5)组件的二次封装
[*]自界说组件。
8. ECharts
(1)ECharts 基础语法
[*]初始化图表: const chart = echarts.init(document.getElementById('chart'));
(2)ECharts 绘制图表
[*]配置项和数据。
(3)ECharts 异步数据加载和更新
[*]动态更新数据。
(4)ECharts 交互组件
[*]工具箱、图例。
(5)ECharts 事件处理
[*]监听点击事件。
9. Node.js
(1)Node.js 基础
[*]模块系统:require和module.exports。
(2)内置模块使用(fs、http 等)
[*]文件操作:fs.readFile()。
[*]创建服务器:http.createServer()。
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
页:
[1]