前端基础
文章平均质量分 77
ganlubaba666
这个作者很懒,什么都没留下…
展开
-
浏览器标准模式和怪异模式之间的区别是什么?
由于历史的原因,不同浏览器对页面的渲染是不同的,甚至同一浏览器的不同版本也是不同的。在W3C标准出台之前,不同的浏览器在页面的渲染上没有同一的规范,产生了差异,即Quirks mode(怪异模式或兼容模式);当W3C标准出台之后,不同浏览器对页面的渲染有了统一的标准,即Strict mode(标准模式或严格模式);这就是两者之间的区别...转载 2018-11-13 15:24:54 · 200 阅读 · 0 评论 -
延长作用域链之with语句
在探究延长作用域的问题之前,首先我们要洞悉一个概念执行环境:定义了变量或函数有权访问的其他数据,每一个执行环境都有一个与之关联的变量对象,环境中定义的所有变量和函数都保存在这个对象中。延长作用域有两个方法try-catch语句的catch块with语句这两个语句都会在作用域链的前端添加一个变量对象今天我们重点探究with语句with语句定义:with语句的作用是将代码的作用域...原创 2018-12-14 19:10:00 · 369 阅读 · 0 评论 -
浅谈弹性布局
今天很悲伤 QAQ,我写了两个星期的项目孵化失败了,原因也很愚蠢,是因为我把css尺寸写死了,没有用到弹性布局。所以我特地学习了弹性布局的时候,在这里通过一些摘抄记录一下难点和疑惑,以供以后参阅。什么是弹性布局?弹性布局,又称“Flex布局”,是由W3C老大哥于2009年推出的一种布局方式。可以简便、完整、响应式地实现各种页面布局。而且已经得到所有主流浏览器的支持,我们可以放心大胆的使用。...原创 2018-12-10 23:11:41 · 1921 阅读 · 0 评论 -
关于调整input里面的输入光标大小
以前在项目里碰到过一个问题input输入框用一个背景图模拟,设置height和line-height一样的高度,使里面的输入文字能够居中,在FF下出现的情况是:点击input时,输入光标其实上跟input的height一样高,但当开始输入文字时,光标又变得跟文字一样高,chrome下光标跟input的height一样高,而IE下光标跟文字的大小一致。一直没弄明白为什么这样子,今天听罗浮宫...转载 2019-02-07 14:43:35 · 1591 阅读 · 0 评论 -
position的属性(sticky属性)
position的属性对position所有的属性的介绍sticky属性定义demosticky生效以及失效fixed属性定义demoabsolute属性定义relative属性定义demo对position所有的属性的介绍https://developer.mozilla.org/zh-CN/docs/Web/CSS/positionsticky属性定义粘性定位元素(stickily ...原创 2019-03-24 21:04:48 · 3187 阅读 · 0 评论 -
用a标签结合有序列表实现select
大家在使用select的时候有没有发现一个问题:固定样式很难隐藏掉,只能通过设置宽度,然后再设置overflow:hidden来隐藏固定的下拉标签这里是一个用a标签结合有序列表来实现select<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <me...原创 2019-03-30 22:59:25 · 383 阅读 · 0 评论 -
数组扁平化
最近学习es6,发现了一个东西很有意思Array.prototype.flat()用于将嵌套的数组“拉平”,变成一维的数组。该方法返回一个新数组,对原数据没有影响。当没有参数时,flat默认只会“拉平”一层[1, 2, [3, 4]].flat()// [1, 2, 3, 4]当参数存在时,flat会拉平指定的层数[12,[2,[3]]].flat(1)(3) [12,...原创 2019-04-18 21:29:38 · 138 阅读 · 0 评论 -
对session和cookie的整理以及自己的理解
cookie1、什么是cookie是指某些网站为了辨别用户身份、进行session跟踪而储存在用户本地终端上的数据(通常经过加密)。Cookie是由服务端生成的,发送给客户端(通常是浏览器)的。Cookie总是保存在客户端中。2、为什么要使用cookie?这是因为http是无状态的,两次请求间,服务器不知道用户上一次执行了什么操作,这严重的阻碍了交互式web应用程序的实现。服务器可以通过...原创 2019-05-03 17:32:49 · 337 阅读 · 0 评论 -
原型链的总结
原型链是js中的重中之重。因为我感觉红宝石书上的记载不够详尽易懂,因此我自己做了一下总结,方便以后复习时使用。这里有几个要注意的点:只有构造函数才有prototype属性构造函数的原型是原型对象,因此函数的原型具有__proto__属性和construct属性构造函数的实例是对象,对象具有__proto__属性,__proto__属性指向构造函数的原型除了Function.proto...原创 2019-04-25 11:26:25 · 145 阅读 · 0 评论 -
利用jsonp实现跨域操作并做出超时处理
什么是jsonpJSONP(JSON with Padding)是JSON的一种“使用模式”,是一种非官方跨域数据交互协议,可用于解决主流浏览器的跨域数据访问的问题。用 JSONP 抓到的资料并不是 JSON,而是任意的填充JSON数据的JavaScript。为什么要使用jsonp1.Ajax直接请求普通文件存在跨域无权限访问的问题2.web页面上调用js文件时不受是否跨域的影响,凡是有s...原创 2019-05-05 21:22:09 · 2935 阅读 · 0 评论 -
上传图片以及使用canvas压缩图片
最近在写一个头像上传的功能用input[‘file’]上传文件并设置类型为图片<input type="file" id="personFile" accept='image/*' @change="upload">在上传头像的时候,首先要把type设置为file,表示这个input是用来实现上传图片功能的,再把accept设置为’image/*’,这样就只能上传图片<...原创 2019-08-05 11:43:55 · 350 阅读 · 0 评论 -
联系promise帮你理解async
文章目录前言主要内容**await**只为**thenable**对象停留1. 非thenable对象2. promise对象3. **thenable**对象async对await的错误决不轻饶逃避async的惩罚前言最近学习了async,并且用async将一个比较复杂的promise请求进行了拆分。在这里总结一下我对async的了解首先这是两句重要的话async是generator...原创 2019-08-06 22:07:41 · 124 阅读 · 0 评论 -
parseInt、parseFloat和Number的区别
NumberNumber可以将Boolean值(true(1),false(0)),数字值,null(0),undefined(NaN),字符串转换为数字。在这里我们讨论Number和parseInt、parseFloat的区别,其实在讨论的是在将字符串转换为数字时这三种方法的异同。字符串中只包含数字(可以包含正负号),两者转换方式相同字符串前有空格,两者都忽略字符串前面的空格,两者转换...原创 2018-12-13 21:55:57 · 3408 阅读 · 0 评论 -
谷歌浏览器关闭跨域(跨域一直是前后端交互头疼问题,个人开发比较常用)
版本号49之前的跨域设置其实直接在打开命令上加–disable-web-security就可以了。具体做法为:1.下载并安装好chorme浏览器后在桌面找到浏览器快捷图标并点击鼠标右键的属性一栏。2.在属性页面中的目标输入框里加上 --disable-web-security新版本49之后谷歌关闭跨域:具体做法为:1.找到谷歌安装目录,例如:C:\Program Files (x...原创 2018-11-25 17:17:39 · 669 阅读 · 0 评论 -
用图灵机器人2.0实现聊天机器人
聊天机器人是我最近写的一个项目,本来以为这个项目的难点是请求ajax,但是真正实现起来,发现,聊天机器人这样的一个小demo对前端的基础的要求还是挺大的,下面我将从HTML、CSS、JS三个方面来阐述我在做这个项目的过程中遇到的一些问题。AJAX说来还挺痛苦的,写机器人的第一天就让我碰到了最让我头疼的跨域问题。解决方案,我发在了...原创 2018-11-25 17:14:22 · 3138 阅读 · 3 评论 -
字体图标的使用
不得不说字体图标使用起来真的很方便,能实现图片的效果,但实施起来却很方便,因为你可以把字体图标当作文字一样去随意修改,比如修改颜色、修改大小等,都十分易于去实现。接下来就说说字体图标如何使用:1、打开网站 icomoon.io(1)点击右上角 Icomoon App1.PNG(2)选择要使用的图标,点击右下角Generate Font2.PNG(3)...转载 2018-11-13 20:15:52 · 139 阅读 · 0 评论 -
对于input标签兼容问题的处理
##placeholderplaceholder属性想必大家都不陌生,在表单的制作中经常会使用这个属性,在写西部经济研究院页面时,我遇到了placeholder的兼容问题,在此我整理一下解决思路。placeholder属性在只在IE9以上的浏览器兼容在Firefox/Chrome/Safari浏览器下点击placeholder,字符不会消失在IE 10+里鼠标点击时(获取焦点)place...原创 2018-11-16 23:17:50 · 1034 阅读 · 0 评论 -
CSS3常用选择器一览表
转载 2018-11-24 11:42:35 · 213 阅读 · 0 评论 -
提交表单
1、2、通过form表单的action传值一般情况下数值在传给后台之前需要校验,可以在form中的onsubmit调用js方法进行校验,当js方法返回值为true时,触发action,当js方法返回值为false时,action不触发。这样处理的好处在于当用户输入不正确时,不会刷新页面,表单仍然会保留用户之前的输入function query(){ var inputs = docum...原创 2018-11-20 15:49:59 · 1924 阅读 · 0 评论 -
CSS浏览器前缀兼容写法
前言Vendor prefix—浏览器引擎前缀,是一些放在CSS属性前的小字符串,用来确保这种属性只在特定的浏览器渲染引擎下才能识别和生效。谷歌浏览器和 Safari浏览器使用的是WebKit渲染引擎,火狐浏览器使用的是Gecko引擎,Internet Explorer使用的是Trident引擎,Opera以前使用Presto引擎,后改为WebKit引擎。一种浏览器引擎里一般不实现其它引擎前缀...转载 2018-11-17 20:56:55 · 204 阅读 · 0 评论 -
vue复习笔记
vue的一些重点难点computedcomputed中的值不能直接修改,要用settercomputed计算属性传参,用闭包computed计算属性的结果会被缓存,除非依赖的响应式属性变化才会重新计算。注意,如果某个依赖 (比如非响应式属性) 在该实例范畴之外,则计算属性是不会被更新的。v-for遍历数组遍历对象数组变动对象变更v-model 在内部为不同的输入元素使用不同的属性并抛出不同的事件:...原创 2019-08-15 16:28:29 · 468 阅读 · 0 评论