前端小知识
向阳️
心如花木,向阳而生.
展开
-
本地存储的区别
这里sessionStorage 、localStorage 和 cookie 之间的区别共同点:都是保存在浏览器端,且同源的。区别:cookie数据始终在同源的http请求中携带(即使不需要),即cookie在浏览器和服务器间来回传递;cookie数据还有路径(path)的概念,可以限制cookie只属于某个路径下。存储大小限制也不同,cookie数据不能超过4k,同时因为每次http请求...转载 2019-07-17 19:33:14 · 1813 阅读 · 0 评论 -
关于display的值与position常用的几种定位
关于display的值,1、none 此元素不会被显示,并且不占据页面空间,这也是与visibility:hidden不同的地方,设置visibility:hidden的元素,不会被显示,但是还是会占据原来的页面空间。2、inline 行内元素 元素会在一行内显示,超出屏幕宽度自动换行,不能设置宽度和高度,元素的宽度和高度只能是靠元素内的内容撑开。例如:span标签3、block 块级元素...原创 2019-08-01 20:44:51 · 2239 阅读 · 0 评论 -
为什么要初始化CSS?
为什么要初始化CSS?CSS初始化是指重设浏览器的样式。不同的浏览器默认的样式可能不尽相同,所以开发时的第一件事可能就是如何把它们统一。如果没对CSS初始化往往会出现浏览器之间的页面差异。每次新开发网站或新网页时候通过初始化CSS样式的属性,为我们将用到的CSS或html标签更加方便准确,使得我们开发网页内容时更加方便简洁,同时减少CSS代码量,节约网页下载时间,因为浏览器的兼容问题,不同浏览...原创 2019-08-01 20:53:28 · 379 阅读 · 0 评论 -
常见的五大浏览器内核
常见的五大浏览器内核浏览器内核备注IETridentIE、猎豹安全、360极速浏览器、百度浏览器firefoxGecko可惜这几年已经没落了,打开速度慢、升级频繁、猪一样的队友flash、神一样的对手chrome。Safariwebkit从Safari推出之时起,它的渲染引擎就是Webkit,一提到 webkit,首先想到的便是 chrome,可以说...原创 2019-08-01 21:05:24 · 295 阅读 · 0 评论 -
css选择符有哪些?那些属性可以继承?优先级算法如何计算?css3新增伪类有哪些
css选择符有哪些,那些属性可以继承,优先级算法如何计算,css3新增伪类有哪些CSS 选择符:1.id选择器(# myid)2.类选择器(.myclassname)3.标签选择器(div, h1, p)4.相邻选择器(h1 + p)5.子选择器(ul > li)6.后代选择器(li a)7.通配符选择器( * )8.属性选择器(a[rel = “external”])9...原创 2019-08-01 21:11:08 · 290 阅读 · 0 评论 -
Doctype作用?标准模式与兼容模式各有什么区别?
Doctype作用?标准模式与兼容模式各有什么区别?声明位于位于HTML文档中的第一行,处于html标签之前。告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。标准模式的排版和JS运作模式都是以该浏览器支持的最高标准运行。在兼容模式中,页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作。...原创 2019-08-01 21:21:12 · 460 阅读 · 0 评论 -
编写一个函数,用于统计一个字符串中出现次数最多的字符和其出现的次数
这是封装好的函数,直接复制使用就可以function Array(str) { if (str.length == 1) { return str; } var newObj = {}; for (var i = 0; i < str.length; i++) { if (!newObj[str.charAt(i)]) ...原创 2019-08-01 21:29:45 · 3773 阅读 · 0 评论 -
常用js原生操作方法
JS原生操作DOM方法通过可编程的对象模型,JavaScript 获得了足够的能力来创建动态的 HTML。JavaScript 能够改变页面中的所有 HTML 元素JavaScript 能够改变页面中的所有 HTML 属性JavaScript 能够改变页面中的所有 CSS 样式JavaScript 能够对页面中的所有事件做出反应我们需要通过javascript操作html元素,查找这些...原创 2019-08-09 09:21:08 · 343 阅读 · 0 评论 -
js判断浏览器内核
如何使用js判断浏览器内核我们可以使用 Browser对象 中的Navigator对象中的userAgent 属性,去识别每一种浏览器,从而通过判断去检测浏览器的内核function getBrowser(n) { var ua = navigator.userAgent.toLowerCase(), s, name = '', ver ...原创 2019-08-20 09:55:44 · 1017 阅读 · 2 评论 -
CSS3的新特性
CSS3新特性:border-radius(实现圆角),box-shadow(盒子阴影),text-shadow(文字阴影),gradient( 线性渐变),transform(旋转),rgba(可以实现背景透明),在CSS3中唯一引入的伪元素是 ::selection ,多栏布局(flex)...原创 2019-08-01 20:35:54 · 184 阅读 · 0 评论 -
css简单实现居中方法
实现盒子居中的css用法.box{ width: 300px; height: 300px; display: flex; flex-direction: column; justify-content: center; }实现文字居中的css用法.box{ font-size:20px; lin...原创 2019-08-01 20:26:12 · 104 阅读 · 0 评论 -
vue中v-if与v-show的区别与共同点
共同点:v-if 和 v-show 都是动态显示DOM元素。区别:编译过程:v-if 是 真正 的 条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。v-show的元素始终会被渲染并保留在 DOM 中。v-show 只是简单地切换元素的 CSS 属性display。编译条件:v-if 是惰性的:如果在初始渲染时条件为假,则什么也不做。直到条件第一次...原创 2019-07-17 19:42:08 · 2012 阅读 · 0 评论 -
什么是闭包
什么是闭包闭包说的通俗一点就是打通了一条在函数外部访问函数内部作用域的通道。正常情况下函数外部是访问不到函数内部作用域变量的。表象判断是不是闭包:函数嵌套函数,内部函数被return,内部函数调用外层函数的局部变量。优点:可以隔离作用域,不造成全局污染。缺点:由于闭包长期驻留内存,则长期这样会导致内存泄漏。如何解决内存泄漏:将暴露在外部的闭包变量置为null。...原创 2019-08-02 21:03:22 · 143 阅读 · 0 评论 -
继承方法
JS继承方式有很多,主要分ES5和ES6继承的实现先说一下ES5是如何实现继承的ES5实现继承主要是基于prototype来实现的,具体有三种方式一是原型链继承:即B.prototype-new A()二是借用构造函数(call 或者 apply 的方式继承) function B(name,age) { A.call(this,name,age) }三是组合继...原创 2019-08-02 21:10:18 · 183 阅读 · 0 评论 -
原型链的继承
原型链是理解js面向对象很重要的一点,这里主要有两点。一是_proto_,二是prototype举个例子例如 function创建一个Person类,然后用new Person 创建一个对象的实例叫p1,在Person类的原型prototype添加一个方法例如 play方法,那对象的实例p1如何查找到play方法,查找过程,具体流程是这样的:首先在p1对象实例上查找是否有play方法...原创 2019-08-02 21:12:05 · 143 阅读 · 0 评论 -
解决跨域jsonp的方法
解决跨域jsonp的方法JSONP是json的一种‘使用模式’,可以用来解决大部分浏览器的数据访问问题,由于同源策略,一般来说位于mp.cn.com的网页无法与不是mp.cn.com的服务器沟通,而HTML的script元素是一个例外,利用script标签可以实现开放策略,网页可以得到其他的json资料,而这种使用模式就是所谓的JSONP。用JSONP抓到的资料并不是要注意JSONP只支持get...原创 2019-08-01 19:55:34 · 201 阅读 · 0 评论 -
数组去重方法
数组去重方法1.简单实现去重的方法function xiou(arr){var brr = [];for(var i = 0; i < arr.length; i++){if(brr.indexOf(arr[i]) == -1){brr.push(arr[i]);}}return temp;}**实现的思路:**将传进去的数组循环出来,使用indexOf去检测数组中是否...原创 2019-08-01 20:07:53 · 159 阅读 · 0 评论 -
转化驼峰
数据进行‘—’切割后,将首位字母转换为大写请看以下代码:function translate(res) {var arr = res.split("-"); // 以-为分隔符截取字符串,返回数组for(var i = 1; i < arr.length; i++) {arr[i] = arr[i].charAt(0).toUpperCase() + arr[i].slice(1)...转载 2019-08-01 20:15:04 · 279 阅读 · 0 评论 -
标准盒模型和怪异盒模型
IE盒模型(怪异盒模型)和标准盒模型的区别就是,IE盒模型中width和height除了content区域外,还包含padding和border。盒子的总宽度为一个块的总宽度= width + margin(左右)(即width已经包含了padding和border值)在标准盒模型下,width和height是内容区域即content的width和height。而盒子总宽度为在标准模式下,一...原创 2019-08-20 10:12:15 · 194 阅读 · 0 评论