- 博客(29)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 声明变量加var和不加var的区别
使用var声明变量var a = 10console.log(a) //10console.log(window.a) //10不使用var声明变量b = 20console.log(b) //20console.log(window.b) //20相同点：不管加不加var，声明的变量都是window对象的属性不同点：var a = 10;delete window.a; //falseb = 20;delete window.b; //tru.
2020-10-15 21:15:35
379
原创 变量提升和函数提升
变量提升使用var声明的变量会被提升到当前作用域的顶部，但是不会赋值，这时的变量为undefinedfunction fun(){ console.log(a); var a = 10;}fun(); //undefined相当于function fun(){ var a; console.log(a); a = 10;}fun(); //.undefined函数提升函数声明式使用函数声明式声明的函数，会被提升到当前作用域的顶部，且提升的是整体con
2020-10-15 20:56:45
213
原创 浅谈前端模块化
前端模块化什么是模块化将一个复杂的程序按照一定的规范封装成几个块，组合在一起，块的内部数据是私有的，只向外暴露一些接口和其他模块通信为什么要模块化解决命名冲突解决文件依赖提高代码的可读性和可维护性降低代码耦合度，提高代码的复用性模块化的发展最早的时候全局作用域被污染，很容易命名冲突var a = 10;function a(){ ...}function b(){ ...}简单封装将变量封装到对象中，减少了全局作用域中的变量数目但是不安全，可以通过对象修改属
2020-10-09 22:54:06
198
原创 gulp@3.9.0学习
gulp@3.9.0学习安装gulp@3.9.1gulp@3.9.1需要与node版本配合，实测node@11.13.0可用npm i gulp@3.9.1 -g //全局安装gulp npm i gulp@3.9.1 -D //本地安装开发依赖gulp安装其他插件gulp-concat //合并文件（js/css）gulp-uglify //压缩js文件gulp-rename //文件重命名gulp-less //编译lessgulp-clean-css /
2020-10-09 16:55:31
444
原创 JavaScript：原型对象及原型链
原型对象及原型链原型对象我们创建的每一个函数都有一个隐含的属性prototype，这个属性对应着一个对象，即原型对象function fun(){ }console.log(typeof fun.prototype) //object用处当函数以普通函数形式调用时，prototype属性没有用处当函数以构造函数形式调用时，它所创建的对象中都有一个隐含的属性指向该构造函数的原型对象function Person(name) { this.name = name}l
2020-09-27 21:12:02
149
原创 谈谈我对闭包的理解
谈谈我对闭包的理解在JavaScript中， 全局作用域不能访问函数作用域中的变量function fun(){ let a = 10;}console.log(a) //a is not defined外部函数作用域不能访问内部函数作用域的变量，而内部函数作用域可以访问外部函数作用域中的变量function outer(){ let a = 10; console.log(b) //b is not defined function inner(){ l
2020-09-26 22:05:59
194
原创 关于同源策略及跨域的解决方案
关于同源策略及跨域的解决方案同源策略同源策略：协议、域名、端口号全相同URL1URL2是否跨域/原因http://www.baidu.com/a.jshttp://www.baidu.com/b.js否 / 协议，域名，端口号都相同http????/www.baidu.com/a.jshttps????/www.baidu.com/b.js是 / 协议不同http://www.baidu.com/a.jshttp://www.taobao.com/b.j
2020-09-26 21:48:11
346
原创 事件捕获事件冒泡事件委派
事件捕获/事件冒泡/事件委托DOM事件流事件捕获阶段当事件发生时，事件从DOM树顶层节点，一直传播到目标节点，这个阶段就叫做事件捕获阶段事件冒泡阶段当事件发生时，事件从目标节点，一直传播到DOM树顶层节点，这个阶段就叫做事件冒泡阶段DOM事件流当事件发生时，事件传播顺序为：事件捕获阶段—>事件目标阶段—>事件冒泡阶段阻止冒泡和取消默认事件阻止冒泡function stopBubble(e){ if(e && e.stopPropagation){
2020-09-25 17:59:38
268
原创 JavaScript：call，apply，bind的用法
call，apply，bind的用法callcall方法的第一个参数是指定的对象，之后的实参依次传入，用逗号分割function fun(arg1, arg2) { console.log(this.name,arg1,arg2)}let obj = { name: "Bob"}fun.call(obj, "a", "b") //Bob a bapplyapply方法的第一个参数是指定的对象，之后的实参放在一个数组里一起传入function fun(arg1,
2020-09-22 22:55:25
97
原创 JavaScript：关于this指向问题的总结
关于this指向问题的总结当函数以函数形式调用时，this指向window对象function fun(){ console.log(this)}fun() //window当函数以方法形式调用时，this指向调用该方法的对象let obj = { name: "Bob", sayName(){ console.log(this.name) }}obj.sayName(); //“Bob"当函数以构造函数形式调用时，this指向新创建的对象functio
2020-09-22 22:41:58
106
原创 Less学习笔记
Less学习Less简介less是一门CSS预处理语言，给CSS增加了变量、函数等特性。Less安装及使用命令行安装1.npm install -g less //安装less2.npm install -g less-plugin-clean-css //安装clean-css，用于压缩css3.lessc index.less index.css4.lessc --clean-css index.less index.min.css引入less.js文件1.创建index.
2020-09-22 21:45:21
410
原创 解决VS Code“因为在此系统上禁止运行脚本”报错
解决VS Code“因为在此系统上禁止运行脚本”报错以管理员身份运行VS Code在终端中执行“get-ExecutionPolicy”命令，显示“Restricted”，表示状态是禁止的在终端中执行“set-ExecutionPolicy RemoteSigned”命令在终端中执行“get-ExecutionPolicy”命令，显示“RemoteSigned”...
2020-09-22 21:41:07
273
原创 Typora设置
Typora设置主题将修改后的github.css文件添加到主题文件夹中设置高亮快捷键偏好设置—>Markdown—>勾选高亮偏好设置—>通用—>打开高级设置—>打开conf.user.json文件"keyBinding": { // for example: // "Always on Top": "Ctrl+Shift+P" "Highlight":"Alt+Q"},图片上传设置图床设置教程点这里其他设置偏好设置—>
2020-09-16 17:36:51
971
原创 Typora+PicGo+GiteeGithub实现图床
Typora+PicGo+Gitee/Github实现图床安装PicGo打开命令行窗口，用npm命令安装picgo（需提前安装好node及npm）npm install picgo -g安装gitee-uploader/github-plus继续在命令行窗口安装gitee-uploader/github-plus插件（需要哪个就安装哪个）picgo install gitee-uploader github-plus设置PicGo配置文件可以在命令行窗口打开config.json文件，也
2020-09-15 22:09:28
286
原创 ES6：var，let，const的区别
letlet不能在同一作用域内重复声明变量let a = 10;let a = 100;//Uncaught SyntaxError: Identifier 'a' has already been declaredvar a = 10;var a = 100;a //100let声明的变量属于块级作用域{ let a = 10; var b = 100;}a //a is not definedb //undefinedlet声明的变量不存在变量提升cons
2020-09-13 18:03:58
105
原创 CSS：CSS实现三角形
Triangle.css:root{ --long: 20px; --short: 10px; --border-color: red;}/* 上三角形 */.triangle_top{ height: 0; width: 0; border-bottom: var(--long) solid var(--border-color); border-right: var(--short) solid transparent; border-l
2020-09-04 16:57:45
134
原创 CSS：解决高度塌陷的问题
高度塌陷当父元素高度自适应时，其子元素浮动后，父元素的高度会变成0解决方案<div class="div1"> <div class="div2"><div></div>指定父元素高度.div1{ height: 100px; //指定父元素高度 border: 10px solid black;}.div2{ height: 50px; width: 50px; background-color: red; fl
2020-09-03 22:51:00
146
原创 CSS：display:none； visibility:hidden；和opacity:0；的区别
display: none;元素不显示不占据空间visibility: hidden;元素不显示占据空间opacity: 0;元素不显示占据空间
2020-09-03 19:15:35
115
原创 CSS：元素的居中
文本居中水平居中text-align: center;垂直居中line-height = height块元素居中水平居中margin: 0 auto;垂直居中position: relative;top: 50%;transform: translateY(-50%);垂直水平居中position: relative;top: 50%;left: 50%;transform: translate(-50%,-50%);...
2020-09-03 19:04:42
75
原创 HTML：盒模型
W3C盒模型（默认）:box-sizing: content-box;设定盒子宽高 = content区域宽高IE盒模型box-sizing: border-box;设定盒子宽高 = 实际盒子宽高
2020-09-03 17:41:04
98
原创 HTML：语义化标签
什么是语义化标签通俗来说，就是每一个标签都有着自己的含义，我们需要根据网页的结构选择合适的标签语义化标签的好处页面内容结构清晰代码结构清晰，便于开发和维护有利于SEO方便其他设备解析...
2020-08-23 13:31:21
214
原创 HTML：常用meta标签
meta标签用于设置页面的元数据，这里列举几个常用的meta标签设置文档的字符编码<meta charset="UTF-8">设置网页关键词<meta name="Keywords" content="xxx">设置网页描述<meta name="description" content="xxx">设置网页重定向<meta http-equiv="refresh" content="3;url=https://www.baidu.com/"&
2020-08-23 13:21:44
92
原创 CSS：兄弟或父子元素垂直外边距重叠的问题
兄弟元素如两个元素相邻，且上面的元素有margin-bottom，下面的元素有margin-top，则两元素之间的间距是margin-top和margin-bottom中大的那个，而不是两者之和<div class="div1"></div><div class="div2"></div>.div1{ height: 200px; width: 200px; background-color: red; margin-bot
2020-08-17 22:11:53
1383
1
原创 JavaScript：构造函数
构造函数构造函数是一种特殊的函数，可以方便的创建实例对象构造函数和普通函数构造函数和普通函数的创建方式一样构造函数一般首字母大写构造函数使用new关键字来调用function person(){} //普通函数，首字母小写person() //普通函数的调用function Person(){} //构造函数，首字母大写var per = new Person() //构造函数的调用，使用new关键字构造函数的执行过程立即创建一个新的对象per将新的对象per设置为
2020-08-16 23:05:49
109
原创 JavaScript：回调函数
什么是回调函数通俗的说，就是将一个函数（回调函数）作为参数传到另一个函数（主函数）中去，主函数会在合适的时候调用回调函数回调函数的实现先创建一个函数afunction a(a,callback){ callback(a) //调用回调函数并传进参数a}再创建一个函数bfunction b(b){ //函数b作为回调函数，定义一个形参b用来接收主函数调用它时传进的实参a console.log(b)}调用函数a时，将函数b作为参数传入函数a中a("Hello",
2020-08-16 22:51:05
113
原创 JavaScript：匿名函数和立即执行函数
普通函数先来看看普通函数的创建方式//1.构造函数var fun = new Function(形参,函数体)//2.函数声明function fun(形参){ 函数体}//3.函数表达式var fun = function(形参){ 函数体}匿名函数function(形参){ 函数体}立即执行函数//方式一(function(形参){ 函数体})(实参)//方式二(function(形参){ 函数体}(实参))...
2020-08-16 22:20:47
269
原创 CSS：控制文本溢出显示省略号
单行文本p{ overflow: hidden; //隐藏文字超出部分 text-overflow: ellipsis; //使用省略号代替超出部分的文字 white-space: nowrap; //文字不换行}多行文本该方案只适合webkit内核的浏览器p{ overflow: hidden; display: -webkit-box; //将对象作为弹性伸缩盒子模型展示 -webkit-box-orient: vertical; //设置或检索伸缩盒
2020-08-16 21:31:02
268
原创 JavaScript：原生JS的Ajax实现
什么是AjaxAjax是Asynchronous JavaScript and XML的缩写，意思是异步的JavaScript和XML，用于前后端进行数据交互创建Ajax的步骤创建XMLHttpRequest对象var xmlhttp;if(window.XMLHttpRequest){ //ie7+ xmlhttp = new XMLHttpRequest(); }else{ //ie5,ie6 xmlhttp = new ActiveXObject("Microsoft.XMLH
2020-08-15 23:40:23
229
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人