随笔分类 - Front-end
Mapbox-图层
摘要：GeoJSON 一种基于JSON的地理空间数据格式，它定义了几种类型JSON对象以及它们组合在一起的方法，以表示有关地理要素、属性和它们的空间范围的数据 GeoJSON单个要素: { "type": "Feature", "geometry": { "type": "Point", "coordin
Mapbox-底图
摘要：加载地图 导入mapbox库和样式 创建渲染容器 创建地图对象 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"
Vue-axios
摘要：axios请求 一个基于 Promise 的 HTTP 客户端，用于浏览器和 node.js 主要的作用是： 发送 HTTP 请求：可以发送 GET、POST、PUT、DELETE 等各种类型的 HTTP 请求。 拦截请求和响应：可以在请求或响应被处理之前拦截它们，进行一些操作，如设置请求头、转换请
Vue-组合式API
摘要：vite构建工具 搭建vue3项目 npm create vite cd dir-vite : 进入项目目录 npm install: 安装依赖 npm run dev: 启动项目 Local: http://localhost:5173/ Network: use --host to expose
Vue-购物车案例
摘要：需求 实现购物车效果 修改数量, 总价格会实时计算 点击按钮移除书籍 代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=
Vue-模板和选项式API
摘要：模板 确定模板有几种方式 以容器的innerHTML做为模板 以template选项做为模板 以render函数做为模板 优先级: render函数 > template > 容器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-
Vue-无构建工具的创建、挂载、渲染
摘要：简介 Vue是一个动态构建用户界面的 渐进式 JS框架. 借鉴了Angular的模板语法和数据绑定 借鉴了React的组件化和虚拟DOM 特点： 声明式渲染: 先声明后使用 响应式数据: 数据改变时, 视图会响应数据的改变, 重新渲染新的值 组件化开发 安装 项目初始化: npm init -y 安
JS-this指向
摘要：普通函数 this的值取决于函数是如何被调用的 <body> <script> // 函数普通中 this指向window function foo() { console.log(this) } foo() // this的指向是在函数调用时确定的 // 函数是由对象调用的, 函数中的this指向
JS-DOM与BOM
摘要：DOM DOM(Document Object Model) 文档对象模型是W3C组织制定并推荐的标准, 这个标准提供了一系列操作HTML的统一API(Application Programming Interface) 核心对象是document 浏览器的工作流程 浏览器读取HTML文件 在内存中
JS-ES6标准
摘要：JS-ES6标准 箭头函数 更简洁的语法：箭头函数允许你不使用function关键字来定义函数。 隐式的return：如果箭头函数的函数体只有一个表达式，那么这个表达式的值会被隐式返回，不需要return关键字。 不绑定自己的this：箭头函数不会创建自己的this上下文，this值由外围最近一层非
JS-数据类型与流程控制
摘要：JavaScript入门 JavaScript是解释性的弱类型编程语言 解释性: 逐行解释, 逐行执行 弱类型: 不区分变量的数据类型 JS的组成 一般认为浏览器中JavaScript由三部分组成 ECMAScript: 基础语法 由ECMA（原欧洲计算机制造商协会）进行标准化的一门编程语言, 主要
CSS-布局与动效
摘要：CSS应用 CSS传统布局 标准流(普通流, 文档流): 按书写顺序排列 浮动 定位 Flexbox和Grid (自适应布局) 浮动 选择器 {float: left/right;}: 创建浮动框, 将其移动到一边, 直到边缘碰到块或另一个浮动框的边缘. 只会在父元素的内部移动 特性 脱标: 脱离标
CSS-选择器与属性
摘要：CSS 层叠样式表 样式表 优点 缺点 使用情况 控制范围 行内样式表 书写方便，权重高 没有实现样式和结构相分离 较少 控制一个标签（少） 内部样式表 部分结构和样式相分离 没有彻底分离 较多 控制一个页面（中） 外部样式表 完全实现结构和样式相分离 需要引入 最多 控制整个站点（多） <!DOC
HTML-元素
摘要：HTML 结构 <!-- 注释 --> <!DOCTYPE html> <html> <head> <title>标题</title> </head> <body> <!-- 主体内容 --> </body> </html> html 元素包括标签和内容，标签中可以包含属性 <p class="ed
