前端
Dreamlandzxx
这个作者很懒,什么都没留下…
展开
-
new运算符的执行过程
新生成了一个对象 链接到原型 绑定 this 返回新对象function _new() { // 创建一个新对象 let newObj = {}; // 获取构造函数 let Constructor = Array.prototype.shift.call(arguments); // 设置空对象的原型 newObj.__proto__ = Constructor.prototype; // 使用apply绑定this,执行构造函数 C原创 2021-07-21 11:55:07 · 226 阅读 · 0 评论 -
CSS水平垂直居中
元素水平居中1.text-align: center;对父元素设置text-align: center;子元素即可居中。但子元素是有限制的,只对图片,文字等行内元素有效。2.margin: 0 auto; 元素本身设置 margin: 0 auto; 这种方法对能设置宽度的元素起作用.3.position:absolute; 父元素:relative,子元素:absolute4.flex父元素:display: flex; justify-content: ce原创 2021-07-19 21:47:40 · 69 阅读 · 0 评论 -
BFC(块级格式化环境)
BFC:块级格式化环境开启BFC后,BFC是一个独立的元素,外面的元素不会影响里面的元素,里面的元素不会影响外面的元素。开启BFC后的特点:1.不会被浮动元素所覆盖。2.子元素和父元素的外边距不会重叠。3.可以包含浮动元素。开启BFC的方式:1.设置浮动(不推荐)2.设为行内块元素(不推荐)3.将元素的overflow设为非visible(常用hidden,其余的auto,scroll)...原创 2021-07-19 21:18:50 · 138 阅读 · 0 评论 -
HTML 与 与 XHTML 二 者 区别
1.所有的标记都必须要有一个相应的结束标记2.所有标签的元素和属性的名字都必须使用小写3.所有的 XML 标记都必须合理嵌套4.所有的属性必须用引号""括起来5.把所有<和&特殊符号用编码表示6.给所有属性赋一个值7.不要在注释内容中使“--”8.图片必须有说明文字复制代码...原创 2021-07-19 21:02:35 · 75 阅读 · 0 评论 -
HTML5新特性
Localstorage,Sessionstorage:本地离线存储 localStorage 长期存储数据,浏览器关闭后数据不丢失; sessionStorage 的数据在浏览器关闭后自动删除。下面从几个方向区分一下 cookie,localstorage,sessionstorage 的区别1、生命周期:Cookie:可设置失效时间,否则默认为关闭浏览器后失效Localstorage:除非被手动清除,否则永久保存Sessionstorage:仅在当前网页会话下有效,关闭页面或浏览器后就会被清原创 2021-07-19 20:55:12 · 118 阅读 · 0 评论 -
Canvas
canvas 是 HTML5 提供的一个用于展示绘图效果的标签.使用 canvas 标签, 即可在页面中开辟一格区域. 可以设置其 width 和 height 设置该区域的尺寸. 默认 canvas 的宽高为 300 和 150. canvas 的兼容性非常强, 只要支持该标签的, 基本功能都一样, 因此不用考虑兼容性问题....原创 2021-07-19 20:32:09 · 55 阅读 · 0 评论 -
label标签的作用
<label>标签的作用是为鼠标用户改进了可用性,当用户点击<label>标签中的文本时,浏览器就会自动将焦点转到和该标签相关联的控件上;为“男”和“女”文字都添加上“label”标签,标签属性“for”的属性值分别为“male”和“female”,这时用户点击“男”和“女”文字时也会选中对应的选项,提高了用户体验。除了单选框之外,多选框、文本框等标签也同样可以用label标签选中:...原创 2021-07-19 20:18:15 · 2893 阅读 · 0 评论 -
CSS 选择符
(1)id选择器(#myid)(2)类选择器(.myclassname)(3)标签选择器(div,h1,p)(4)后代选择器(h1 p)(5)相邻后代选择器(子)选择器(ul>li)(6)兄弟选择器(li~a)(7)相邻兄弟选择器(li+a)(8)属性选择器(a[rel="external"])(9)伪类选择器(a:hover,li:nth-child)(10)伪元素选择器(::before、::after)(11)通配符选择器(*)::before 和:a原创 2021-07-18 22:18:21 · 71 阅读 · 0 评论 -
什么是盒模型?
(1)有两种盒子模型:IE盒模型(border-box)、W3C标准盒模型(content-box)(2)盒模型:分为内容(content)、填充(padding)、边界(margin)、边框(border)四个部分IE盒模型和W3C标准盒模型的区别:(1)W3C标准盒模型:属性width,height只包含内容content,不包含border和padding(2)IE盒模型:属性width,height包含content、border和padding,指的是content+paddi原创 2021-07-18 22:08:58 · 76 阅读 · 0 评论 -
webpack和gulp之间的区别
gulpgulp强调的是前端开发的工作流程,我们可以通过配置一系列的task,定义task处理的事务(例如文件压缩合并、雪碧图、启动server、版本控制等),然后定义执行顺序,来让gulp执行这些task,从而构建项目的整个前端开发流程。webpackwebpack是一个前端模块化方案,更侧重模块打包,我们可以把开发中的所有资源(图片、js文件、css文件等)都看成模块,通过loader(加载器)和plugins(插件)对资源进行处理,打包成符合生产环境部署的前端资源。两者区别虽然都是原创 2021-07-16 22:20:22 · 193 阅读 · 0 评论 -
什么是Fetch,它和Ajax比有什么优势?
由来:当我们只需要发送Ajax请求时,需要引入整个jQuery,这是非常不合理的。故随着react和vue框架的兴起,于是便有了fetch来解决这一问题概念:fetch号称是ajax的替代品,它的API是基于Promise设计的,旧版本的浏览器不支持Promise,需要使用polyfill es6-promise二者举例对比:// 原生XHR var xhr = new XMLHttpRequest(); xhr.open('GET', url); xhr.onreadystatec..原创 2021-07-16 21:59:11 · 574 阅读 · 0 评论 -
AJAX请求
Ajax 能够在不重新加载整个页面的情况下与服务器交换数据并更新部分网页内容,实现局部刷新,大大降低了资源的浪费,是一门用于快速创建动态网页的技术,ajax 的使用分为四部分:1、创建 XMLHttpRequest 对象 var xhr = new XMLHttpRequest();2、向服务器发送请求,使用 xmlHttpRequest 对象的 open 和 send 方法,3、监听状态变化,执行相应回调函数var xhr = new XMLHttpRequest();xhr.open('g原创 2021-07-16 21:37:27 · 102 阅读 · 0 评论 -
服务端JSONP相关问题
(1)什么是JSONP?JSONP是一种轻量级的数据交换格式,采用完全独立于编程语言的文本格式来存储和表示数据。JSON提供了stringify和parse方法的内置对象stringify将js对象转化为符合json标准的字符串parse将符合json标准的字符串转化为js对象(2)JSONP的 缺点JSON 只支持 get,因为 script 标签只能使用 get 请求;JSONP 需要后端配合返回指定格式的数据。(3)JSONP解决跨域问题JSONP:ajax 请求受同原创 2021-07-14 22:33:48 · 157 阅读 · 0 评论 -
关于JS中闭包的理解
(1)什么是闭包?闭包是指有权访问另外一个函数作用域中的变量的函数。闭包就是函数的局部变量集合,只是这些局部变量在函数返回后会继续存在。闭包就是就是函数的“堆栈”在函数返回后并不释放,我们也可以理解为这些函数堆栈并不在栈上分配而是在堆上分配。当在一个函数内定义另外一个函数就会产生闭包。(2)用来做什么?匿名自执行函数:我们知道所有的变量,如果不加上 var 关键字,则默认的会添加到全局对象的属性上去,这样的临时变量加入全局对象有很多坏处,比如:别的函数可能误用这些变量;造成全局对象过于庞大,影响原创 2021-07-14 22:17:30 · 151 阅读 · 0 评论