- 博客(48)
- 收藏
- 关注
RSS订阅原创 在js中谈谈你对this的看法
谁调用方法this就指向谁，没有对象调用的时候就指向window，在严格模式下不调用方法为undefined，改变this指向有三种方法：call（）传递的参数是字符串，会直接让函数调用；apply（）传递的参数是数组，会让函数直接调用；bind(）传递的参数是字符串，不会直接让函数调用...
2021-09-27 16:50:33
119
原创 vue路由跳转携带参数时query和params的区别
vue携带参数传参的方法可以参考以下文章vue路由跳转和传参的方式现在我们以this.$router.push({name: 'index', params: {id: '1'}})this.$router.push({name: 'index', query: {id: '1'}})来举例说明query和params的区别：vue路由传参共有两种方法，分别是通过params传参和通过query传参，两者区别如下：1.用params传参的时候页面跳转之后的页面路径为http://local
2021-09-27 15:41:58
789
原创 vue路由跳转和传参的几种方式
1.通过router-link的方法：不带参数的情况：<router-link :to="{name:'index'}">点击跳转到index页面</router-link>或者<router-link :to="{path:'/index'}">点击跳转到index页面</router-link>带参数的情况：<router-link :to="{name:'index',params: {id:1}}">点击跳转到index页面
2021-09-27 15:03:34
965
原创 css实现左右两边宽度固定，中间自适应的布局效果
最终实现效果实现方法1：通过浮动实现，代码如下<div class="fa"> <div class="left">111</div> <div class="right">333</div> <div class="center">222</div></div>.fa{ height: 500px;}.left{ width: 200px; height: 100%;
2021-09-27 10:33:46
600
原创 css控制文字多余部分省略号显示
css控制文字多余部分省略号显示HTML部分代码 <body> <div class="text_box"> Vue是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。 Vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。 </div> </body>css代码单行显示，多余文字显示省略号.text_box{ width
2021-03-22 17:53:22
139
原创 谈谈对深拷贝和浅拷贝的理解
浅拷贝只是复制了对象的引用地址，两个对象指向同一个内存地址，当修改其中任意的值，另一个值都会随之变化代码如下：var obj = { id:1, name:'zhang', msg:{ age:18 }, color:['#f00','#0f0','#00f'] }; var o = {}; // 浅拷贝 for(var k in obj){ // k...
2019-08-21 20:47:48
142
原创 js实现数组去重
var arr = [1,2,1,2,4,4,5,5]; var arr1 = []; for(var i=0;i<arr.length;i++){ if(arr1.indexOf(arr[i]) < 0){ arr1.push(arr[i]) } } console.log(arr1);
2019-08-21 20:40:15
87
原创 var let const 的区别
1.var声明变量会挂载在widow上，而let和const声明的变量不会var a = 10;console.log(window.a);//10let b = 11;console.log(window.b);//undefinedconst c = 12;console.log(window.c);//undefined2.var声明的变量存在变量提升，let和const不存...
2019-08-17 16:55:28
371
原创 HTML语义化的理解
什么是语义化：就是写的HTML结构，正确地运用标签为什么要语义化：1.为了在没有css的情况下页面也能很好地展示页面结构，代码结构2.提高用户体验，例如img标签的title和alt3.有利于SEO，有助于爬虫抓取更多的有效信息，爬虫依赖于标签来确定上下文4.有利于开发和维护写HTML代码时应注意什么：1.尽可能少的使用无语义的标签div和span2.语义不明显时，尽量不使用div...
2019-08-17 16:42:11
107
原创 前端需要注意哪些SEO
1.合理的title,keywrods,title值强调重点即可，不同页面title要有所不同，keywords举例出重要的关键词即可2.语义化的HTML代码，让搜索引擎更容易理解网页3.重要的HTML代码放在最前面，搜索引擎抓取HTML顺序是从上到下4.重要的内容不要使用js输出，爬虫不会执行js获取的内容5.提高网站速度...
2019-08-17 16:27:18
431
原创 src 和 href 的区别
src指外部资源的位置，指向的内容会嵌入到文档中当前标签的位置href 指向网络资源所在位置，建立和当前元素或当前文档之间的链接 比如a标签 和link...
2019-08-17 16:23:02
136
原创 单页面应用的优缺点
单页面应用指只有一个主页面的应用，浏览器一开始就要加载所有必须的html，js，ss，单页面的页面跳转仅刷新局部资源，多应用于pc端，多页面就是指一个页面中有多个页面，页面跳转时是整页刷新单页面优点：1.用户体验好，快，内容改变不需要重新加载整个页面；2.没有页面之间的切换，就不会出现“白屏现象”单页面缺点：1.首次加载耗时比较多；2.不利于SEO3.不可以用导航实现前进后退效果；...
2019-08-17 16:20:25
4167
原创 canvas画布创建图片
获取元素var can = document.getElementsByTagName(‘canvas’)[0];绘制画布上下文var context = can.getContext(‘2d’);创建图片对象var image = new Image();监听图片加载image.onload = function(){绘制图片 有三种情况 使用其中的一种即可1.三个参数 ...
2019-06-18 20:44:10
1375
原创 canvas画布的渐变样式设置
创建渐变样式：四个参数 开始渐变的x y坐标 和 结束渐变的x y坐标var gradient=context.createLinearGradient(100,100,300,100);var gradient1=context.createLinearGradient(100,100,300,100);每个阶段的渐变样式两个参数 第一个参数 0-1渐变阶段 第二个参数 渐变的颜色...
2019-06-18 20:39:11
768
原创 canvas画布基础知识总结
canvas设置宽高和样式< canvas width=“400” height=“600” style=“border:1px solid #ff0” >< /canvas >获取画布var canvas = document.getElementsByTagName(‘canvas’)[0];操作画布上下文var context = can.getContex...
2019-06-18 20:35:08
364
原创 预加载和懒加载
预加载一般用于移动端 用于图片比较多的情况 避免在项目中加载缓慢 影响用户体验 所以需要在进入项目前提前加载图片做法是把所有图片的路径 放在一个数组中 然后使用循环遍历这个数组 每次创建一个图片对象 并把路径赋值给这个图片对象的src属性 这样就完成加载 其中使用 onload事件判断每个图片是否加载完成懒加载项目中图片过多的情况下 一般在可视窗口内的图片加载 可视窗口之外的图片不加载 当...
2019-06-14 12:30:48
950
原创 offsetHeight clientHeight scrollHeight三者的区别与浏览器表现
offsetHeight = height + padding + border;clientHeight = height + padding;scrollHeight = srcollTop + clientHeight + offsetHeight;在文档中offsetHeight是内容区域的高度 document.document.offsetHeight + document.bo...
2019-05-27 21:12:26
708
原创 cookie localStorage sessionStorage的相同点和不同点
相同点：这三者都是存储在浏览器本地的不同点：1. localStorage 和 sessionStorage的大小都是5mb左右，cookie的大小为4kb左右；2. localStorage如果不清除永远都在，sessionStorage关闭浏览器的时候会自动清除，cookie可以设置过期时间，如果不设置的话，关闭浏览器的时候会自动清除；3.cookie可以通过http协议进行传递，前...
2019-05-27 16:00:10
531
原创 tween.js的使用方法
tween.js是一款可生成平滑动画效果的js动画库。Tween.缓动函数名.缓动效果名即tween.js的四个参数为(t,b,c,d);t:代表当前已经运动的时间b:代表初始值c:代表变化量d:代表持续时间代码入下：...
2019-05-27 15:39:27
3565
1
原创 通过js代码实现通过可以关键字key获取val值
代码如下：当输入age的时候控制台会显示18；当输入name的时候控制台会显示zhangsan；当输入height的时候控制台会显示178；
2019-05-27 15:09:55
1070
原创 tab切换
代码如下：当点击1234的时候字体会变成红色，分别对应下面的第一个第二个第三个第四个，在实际应用时可以加入相应的内容，例如点击3的时候如图所示：...
2019-05-27 14:59:20
97
原创 对于浮动的看法
浮动可以使块元素排成一行，包括左浮动和右浮动，当浮动元素的框碰到了父元素的边框或者是另一个浮动框的边框时停止，浮动让行内元素支持设置宽度和高度，浮动也可以实现文字包围图片的效果，当父元素不设置高度的时候，浮动会脱离父元素，因此需要清除浮动，清除浮动的常用方法包括三种，一种是在父元素中设置overflow:hidden;还有一种就是添加额外的标签，比如在父元素内添加一个<div style="...
2019-05-14 20:17:42
193
原创 谈谈你对盒模型的看法
css盒模型分为两种，一种是w3c标准盒模型，一种是IE盒模型，在盒模型中，宽度=左外边距+左边框+左内边距+内容宽度+右内边距+右边框+右外边距；不管是IE盒模型还是标准盒模型都遵循这个守则，但是有一点，在计算盒子宽度的时候，w3c标准盒模型的边框是算在宽度里边的，但是IE盒模型的边框是不算在里面的，比如说有一个宽度为400px的盒子，在标准盒模型中，400px的宽度是由398px的内容宽度和2...
2019-05-14 19:16:14
913
原创 遍历的理解
遍历存在于类似于循环或数组的结构中，没有循环就不存在遍历，遍历要访问到循环或数组中的每一个元素，然后参加各种运算，这种现象就是遍历。
2019-04-18 17:32:31
1046
原创 js代码实现提交评论删除评论
提交评论删除评论的js代码如下：运行结果如图所示，在输入框输入文字点击提交后评论内容会提交到上方的 li 中，当点击删除的时候会删除内容所在的整个 li...
2019-04-17 20:23:04
2365
原创 数组操作方法
arr.join(“符号”) 拼接arr.push() 追加元素 返回长度arr.pop() 删除最后一个元素，返回被删除的元素arr.unshift() 向数组的开头添加一个或更多元素，并返回新的长度。arr.shift() 删除并返回数组的第一个元素数组的指针 下移 一位arr.reverse() 颠倒数组中元素的顺序。arr.sort() 对数组的元素进行排序注意：从小到大...
2019-04-14 20:27:36
129
原创 substring substr slice差异
substring(起始位置，终止位置) 返回截取的自字符串，包含起始位置，不包含终止位置如果只有起始位置，从该位置截取到最后负数不起效substr(起始位置，长度) 从起始位置截取长度个数数据如果只有起始位置，从该位置截取到最后负数倒数位置，从-1开始，从负数位置截取到最后slice(起始位置，终止位置) 返回截取的自字符串，包含起始位置，不包含终止位置如果只有起始位置，从该位置...
2019-04-14 20:22:10
127
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人