cheng_09的博客

HTML语义化

cheng_09 — Thu, 13 May 2021 10:39:28 +0800

HTML语义化关于语义语义是对标记与符号之间的关系，以及它们的含义的研究。在前端web开发的上下文中，语义大多是与元素，属性，和属性值（包括像Microdata之类的扩展）的一致认同意义相关。这些认同意义通常在规范中被定义概念，它们可以帮助程序员更好地理解网站中信息的不同方面。但是，即使是规范化之后，元素、属性、属性值的语义还是受制于开发者对其的适应和吸收。这可能会导致后续对正式认同语义的修改。什么是语义化？语义化的含义就是用正确的标签做正确的事情，html语义化就是让页面的内容结构化，便于对浏览器、

mock入门

cheng_09 — Wed, 24 Feb 2021 18:06:46 +0800

mock快速入门教程什么是mock？它的使用场景是什么？当前端工程师需要独立于后端进行开发时，后端接口还没有完成，那么怎么获取数据？这时可以考虑前端搭建web server自己模拟数据，这里我们选第三方库mock.js用来生成随机数据，拦截Ajax请求。下面是mock的原理图 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-pgANDhy0-1614161153994)(C:\Users\86130\AppData\Roaming\Typora\typora-user-

axios（三）axios的介绍和特点

cheng_09 — Tue, 09 Feb 2021 21:54:07 +0800

axios的介绍和特点 3.1 axios是什么？前端最流行的ajax请求库 react/vue官方都推荐使用axios发ajax请求文档：https://github.com/axios.axios 3.2 axios特点基于promise的异步ajax请求库浏览器端/node端都可以使用支持请求/响应拦截器支持请求取消请求/响应数据转换批量发送多个请求 3.3 axios常用语法 axios(config)：通用/最本质的发任意类型请求的fs aios(url[, config]

axios（二）XHR的理解和使用

cheng_09 — Tue, 09 Feb 2021 14:26:54 +0800

ch2. XHR的理解和使用 2.1 理解使用XMLHttpRequest(XHR)对象可以与服务器交互，也就是发送ajax请求前端可以获取到数据，而无需让整个的页面刷新这使得Web页面可以只更新页面的局部，而不影响用户的操作 2.2 区别一般http请求与ajax请求 ajax请求是一种特别的http请求对服务器来说，没有任何区别，区别在浏览器端浏览器端发请求：只有XHR或fetch发出的才是ajax请求，其他所有的都是非ajax请求浏览器端接收到响应 (1)一般请求：浏览

axios（一）HTTP相关知识

cheng_09 — Mon, 08 Feb 2021 14:21:12 +0800

ch1. HTTP相关 1.1 HTTP请求交互的基本过程前后应用从浏览器端向服务器端发送HTTP请求（请求报文）后台服务器接收到请求后，调度服务器应用处理信息，向浏览器端返回HTTP响应（响应报文）浏览器端接收到响应，解析显示响应体/调用监视回调 1.2 HTTP请求报文请求行： method url //请求方式地址 GET /product_detail?id=2 POST /login 多个请求头 Host: www.baidu.com //主机 Cookie: BAIDU=

开发中方法与函数的区别

cheng_09 — Wed, 06 Jan 2021 11:03:40 +0800

方法（method）在类里的一般称之为方法，因为方法都是和某个实例对象挂钩的例子： const obj = { counter = 0, msg :'hello' } const app = new Vue({ el:'#app', data: obj, methods:{ add: function(){ this.counter++ }, sub: function(){ this.counter-- } } }) 在此代码块中，add和sub都被称为方.

Git常用命令/使用TortoiseGit管理文件版本

cheng_09 — Sat, 02 Jan 2021 19:47:46 +0800

Git常用命令环境配置当安装Git后首先需要做的事情是设置用户名称和email地址。设置用户信息 git config --global user.name “xxxx” git config --global user.email “xxx@xxx.com” 查看配置信息 git config --list git config user.name 获取Git仓库要使用Git对我们的代码进行版本控制，首先需要获得Git仓库获取Git仓库通常有两种方式在本地初始化一个Git仓库从远程仓库克隆

vue综合案例一--图书管理

cheng_09 — Sun, 29 Nov 2020 19:52:24 +0800

vue综合案例1-图书管理补充知识（数组相关API）变异方法（修改原有数据） push（） pop（） shift（） unshift（） splice（） sort（） reverse（）

Vue模板语法

cheng_09 — Sat, 28 Nov 2020 22:15:49 +0800

3. VUE模板语法 3.1 模板语法概述 1. 如何理解前端渲染把数据填充的到HTML标签中【模板】+【数据】==》前端渲染 ==》静态HTML内容 2. 前端渲染方式原生js拼接字符串基本上就是讲数据以字符串的方式拼接到HTML标签中，前端代码风格大体如下所示 var d = data.weather; var info = document.getElementById('info'); info.innerHTML = ''; for(var i = 0;i

Vue概述+Vue基本使用

cheng_09 — Sat, 28 Nov 2020 22:14:17 +0800

Vue概述+Vue基本使用 1.Vue概述 Vue：渐进式JavaScript框架声明式渲染 → 组件系统 → 客户端路由 → 集中式状态管理 → 项目构建易用：熟悉HTML、CSS、JavaScript知识后，可快速上手vue 灵活：在一个库和一套完整框架之间自如伸缩高效：20kB运行大小，超快虚拟DOM 2. Vue基本使用 2.1 Vue基本使用需要提供标签用于填充数据引入vue.js库文件可以使用vue的语法做功能了把vue提供的数据填充到标签里面

Image &l

4_最佳实践（DOM编程艺术）

cheng_09 — Sat, 31 Oct 2020 23:01:43 +0800

5. 最佳实践 5.1 过去的错误 5.2 平稳退化讨论在用户点击某个链接时弹出一个新窗口（注意：应该只在绝对必要的情况下才使用弹出窗口，因为这牵涉到网页的可访问性问题） JavaScript使用window对象的open()方法来创建新的浏览器窗口，该方法有三个参数 window.open(url,name,features) 这三个参数都是可选的第一个参数是网页的URL地址，忽略后屏幕上将弹出一个空白的浏览器窗口第二个参数是新窗口的名字第三个参数是一个以逗号分割的字符串，其内容是新窗口的各

3_案例研究：JavaScript图片库（DOM编程艺术）

cheng_09 — Sat, 31 Oct 2020 22:58:31 +0800

4. 案例研究：JavaScript图片库 4.1 标记 4.2 JavaScript 4.2.1 非DOM解决方案 4.2.3 最终的函数代码清单 <

2_DOM（DOM编程艺术）

cheng_09 — Fri, 30 Oct 2020 13:38:30 +0800

3. DOM 3.1 文档：“D” 3.2 对象：“O” 3.3 模型：“M” 3.4 节点文档是由节点构成的集合，只不过此时的节点是文档树上的数值和树叶而已 3.4.1 元素节点 body、p、ul之类的元素，在文档中的布局形成了文档的结构标签的名字就是元素的名字元素可以包含其他的元素。事实上，没有包含在其他元素里的唯一元素是html元素，它是我们节点树的根元素 3.4.2 文本节点绝大多数内容都是由文本提供的在XHTML文档里，文本节点总是被包含在元素节点的内部，但并非所有的元素节点都包含有文

1_JavaScript语法（DOM编程艺术）

cheng_09 — Fri, 30 Oct 2020 13:36:50 +0800

2. JavaScript语法 2.1 准备工作 2.2 语法 2.2.1 语句建议在每条语句的末尾都加上一个分号，这是一个良好的编程习惯。 2.2.2 注释 //自我提醒：有注释是好事 /*自我提醒：有注释是好事*/ 2.2.3 变量 JavaScript允许程序员直接对变量赋值而无需事先声明 var mood = "happy", age =33; 像上面这样声明和赋值是最有效率的做法，相当于： var mood, age; mood = "happy"; age =33; 在JavaS

数据库#1-2_数据模型

cheng_09 — Thu, 29 Oct 2020 20:23:45 +0800

数据模型也是一种模型，它是对现实世界数据特征的抽象把现实世界中具体的人、物、活动、概念用数据模型这个工具来抽象、表示和处理 1.2.1 两类数据模型数据模型应满足三方面要求：一是能比较真实地模拟现实世界，二是容易被人所理解，三是便于在计算机上实现第一类是概念模型，也称信息模型，它是按用户的观点来对数据和信息建模，主要用域数据库设计第二类是逻辑模型和物理模型，第二类中的逻辑模型主要包括层次模型、网状模型、关系模型、面向对象数据模型和对象关系数据模型、半结构化数据模型等。它是按计算机系统的观点.

CSS精灵图/字体图标/三角/用户界面模式/vertical-align/溢出文字省略号/常见布局技巧/CSS初始化

cheng_09 — Sat, 24 Oct 2020 09:05:03 +0800

CSS高级技巧 1. 精灵图 1.1 为什么需要精灵图一个网页中往往会应用很多小的背景图像作为修饰，当网页中的图像过多时，服务器就会频繁地接收和发送请求图片，造成服务器请求压力过大，这将大大降低页面的加载速度。因此，为了有效地减少服务器接收和发送请求的次数，提高页面的加载速度，出现了 CSS 精灵技术（也称 CSS Sprites、CSS 雪碧）。核心原理：将网页中的一些小背景图像整合到一张大图中，这样服务器只需要一次请求就可以了。 1.2 精灵图（sprites）的使用使用精灵图核心：精灵

CSS定位/元素的显示与隐藏/网页布局/案例

cheng_09 — Fri, 23 Oct 2020 21:47:41 +0800

CSS 05 1. 定位 1.1 为什么需要定位某个元素可以自由的在一个盒子内移动位置，并且压住其他盒子. 当我们滚动窗口的时候，盒子是固定屏幕某个位置的。 1.2 定位组成定位：将盒子定在某一个位置，所以定位也是在摆放盒子，按照定位的方式移动盒子。定位 = 定位模式 + 边偏移。定位模式用于指定一个元素在文档中的定位方式。边偏移则决定了该元素的最终位置。定位模式定位模式决定元素的定位方式，它通过 CSS 的 position 属性来设置，其值可以分为四个： [外链图片转存失败,源

CSS浮动/常见网页布局/清除浮动/学成在线案例

cheng_09 — Fri, 23 Oct 2020 19:56:40 +0800

CSS 04 1. 浮动（float） 1.1 传统网页布局的三种方式网页布局的本质——用 CSS 来摆放盒子。把盒子摆放到相应位置. CSS 提供了三种传统布局方式(简单说,就是盒子如何进行排列顺序)：普通流（标准流）浮动定位注意：实际开发中，一个页面基本都包含了这三种布局方式 1.2 标准流（普通流/文档流）所谓的标准流: 就是标签按照规定好默认方式排列. 块级元素会独占一行，从上向下顺序排列。常用元素：div、hr、p、h1~h6、ul、ol、dl、form、table