厦门网站建设公司推荐,网址导航app大全,招远网站建设公司,品牌建设的五个阶段1.清除浮动的方式有哪些#xff1f;
高度塌陷#xff1a;当所有的子元素浮动的时候#xff0c;且父元素没有设置高度#xff0c;这时候父元素就会产生高度塌陷。
清除浮动的方式#xff1a;
1.1 给父元素单独定义高度
优点#xff1a; 快速简单#xff0c;代码少
缺…1.清除浮动的方式有哪些
高度塌陷当所有的子元素浮动的时候且父元素没有设置高度这时候父元素就会产生高度塌陷。
清除浮动的方式
1.1 给父元素单独定义高度
优点 快速简单代码少
缺点无法进行响应式布局1.2 父级定义overflow:hidden;zoom:1;(针对ie6的兼容)
优点简单快速代码少兼容性较高
缺点超出部分被隐藏布局时要注意1.3 在浮动元素后面加一个空标签clear:both;height:0;overflow:hidden
优点简单快速代码少兼容性较高
缺点增加空标签不利于页面优化1.4 父级定义overflow:auto
优点简单代码少兼容性好
缺点内部宽高超过父级div时会出现滚动条1.5 万能清除法
给塌陷的元素添加伪元素
.father :after{content:随便写;clear:both;display:block;height:0;overflow:hidden;visibility:hidden;
}优点写法固定兼容性高
缺点代码多2.如何让chrome浏览器显示小于12px的文字
本来添加谷歌私有属性 -webkit-text-size-adjust:none现在-webkit-transform:scale()
3.网页中有大量图片加载很慢优化方法有哪些
3.1 图片懒加载
在图片未可视区域添加一个滚动条事件判断图片位置与浏览器顶端和页面的距离如果前者小于后者优先加载
3.2 使用图片预加载技术
将当前展示图片的前一张和后一张优先下载
3.3 使用cssprite或者svgsprite
4.margin和padding在什么场合下使用
margin外边距自身边框到另一个边框之间的距离 padding内边距自身边距到自身内容之间的距离
当需要在border外侧添加空白时用margin,当需要在border内测添加空白时用padding
5.px rem em的区别
5.1 px绝对长度单位像素px是相当于显示器屏幕分辨率来说的
5.2 em相对长度单位相对于当前对象内文本的字体尺寸 em的值并不是固定的em会继承父级元素的字体大小(参考物是父元素的font-size)em中所有的字体都是相对于父元素的大小决定的5.3 rem相对于Html根元素的font-size
1em1rem16px 在body中加入font-size:62.5% 这样直接就是原来的px数值除以10加上em就可以
6.三栏布局方式两边固定中间自适应
6.1 margin负值法
左右两栏均左浮动左右两栏采用负的margin值中间栏被宽度为100%的浮动元素包起来
6.2 自身浮动法
左栏左浮动右栏右浮动中间栏放最后
6.3 绝对定位法
左右两栏采用绝对定位分别固定于页面的左右两侧中间的主体栏用左右margin值撑开距离
6.4 flex :
左右固定宽中间flex:1
6.5 网格布局
6.6 table布局
7.浏览器输入网址到页面渲染全过程
1.DNS解析
2.TCP连接
3.发送http请求
4.服务器处理请求并返回http报文
5.浏览器解析渲染页面
6.连接结束
输入url后首先需要找到这个url域名的服务器ip浏览器首先会寻找缓存查看缓存中是否有记录。缓存的查找记录为浏览器缓存-系统缓存-路由器缓存
缓存中没有则查找系统的hosts文件中是都有记录如果没有则查询DNS服务器
查询DNS服务器得到服务器的ip地址后浏览器根据这个ip以及相应的端口号构造一个http请求这个请求报文会包括这次请求的信息主要是请求方法请求说明和请求附带的数据并将这个http请求封装在一个tcp包中 这个tcp包会依次经过传输层、网络层、数据链路层、物理层到达服务器服务器解析这个请求来做出响应返回相应的html给浏览器
8.一个完整的ajax请求包括五个步骤
8.1 创建XMLHTTPRequest对象
8.2 使用open方法创建http请求并设置请求地址
8.3 xhr.open(get/post,url,async,true(异步),false(同步)) 经常使用前三个参数
8.4 设置发送的数据用send发送请求
8.5 注册事件(给ajax设置事件)
8.6 获取响应并更新页面
9. 闭包是什么有什么特性对页面会有什么影响
闭包可以简单理解成定义在一个函数内部的函数。其中一个内部函数 在包含它们的外部函数之外被调用时就会形成闭包。
特点
1.函数嵌套函数。
2.函数内部可以引用外部的参数和变量。
3.参数和变量不会被垃圾回收机制回收。使用
1.读取函数内部的变量
2.这些变量的值始终保持在内存中不会在外层函数调用后被自动清除。优点
1:变量长期驻扎在内存中
2:避免全局变量的污染
3:私有成员的存在 缺点会造成内存泄露10.数组方法有哪些请简述
push() 从后面添加元素返回值为添加完后的数组的长度 pop() 从后面删除元素只能删除一个返回值是删除的元素 shift() 从前面删除元素只能删除一个返回值是删除的元素 unshift() 从前面添加元素返回值是添加完后的数组的长度 splice(i,n) 删除从索引i开始之后的那个元素返回值是删除的元素 concat() 连接两个数组返回值为连接后的新数组 split() 将字符串转化为数组 sort() 将数组进行排序返回值是排好的数组默认是按照最左边的数字进行排序不是按照数字大小排序的 reverse() 将数组反转返回值是反转后的数组 slice(start,end)切去索引值start到索引值end的数组不包含end索引的值返回值是切出来的数组 forEach(callback) 遍历数组无return 即使有return也不会返回任何值并且会影响原来的数组 map(callback) 映射数组(遍历数组)有return返回一个新数组 filter(callback) 过滤数组返回一个满足要求的数组
11.promise可以用来解决什么问题
promise是用来解决两个问题的
11.1 回调地狱
代码难以维护常常第一个的函数的输出是第二个函数的输入这种现象
11.2 多并发请求
promise可以支持多并发的请求获取并发请求中的数据这个promise可以解决异步的问题本身不能说promise是异步的
12.简述async的用法
async 就是 generation和promise的语法糖async就是将generator的*换成 async将yiled换成await
函数前必须加一个async异步操作方法前加一个await关键字意思就是等一下执行完了再继续走注意await只能在async函数中运行否则会报错。
promise如果返回的是一个错误的结果如果没有做异步处理就会报错所以用try…catch捕获一下异常就可以了
13.一个页面从输入url到页面加载显示完成这个过程中都发生了什么
13.1 当发送一个url请求时不管这个url是web页面的url还是web页面上每个资源的url浏览器都会开启一个线程来处理这个请求同时在远程DNS服务器上启动一个DNS查询这能使浏览器获得请求对应得IP地址。
13.2 浏览器与远程web服务器通过 TCP三次握手协商来建立一个TCP/IP连接该握手包括一个同步报文一个同步-应答报文和一个应答报文这三个报文在浏览器和服务器之间传递该握手首先由客户端尝试建立起通信然后服务器响应并接受客户端的请求最后由客户端发出该请求已经被接受的报文。
13.3 一旦TCP/IP 连接建立浏览器会通过该连接向远程服务器发送HTTP的GET请求远程服务器找到资源并使用HTTP响应返回该资源
13.4 此时web服务器提供资源服务客户端开始下载资源。
14.闭包的简单定义
一句话概况闭包就是能够读取其他函数内部变量的函数或者子函数在外调用子函数所在的父函数的作用域不会被释放。
15.改变this指向的函数(bind,apply,call的区别)
通过 apply和call改变函数的this指向他们两个函数的第一个参数都是一样的表示要改变指向的那个对象第二个参数apply是数组而call则是 arg1,arg2…这种形式。通过bind改变this作用域会返回一个新的函数这个函数不会马上执行。
16.js的各种位置比clientHeight,scrollHeight,offsetHeight,以及scrollTop,offsetTop,clientTop的区别
clientHeight表示的是可视区域的高度不包含border和滚动条 offsetHeight表示可视区域的高度包含了Border和滚动条 scrollHeight表示了所有区域的高度包含了因为滚动隐藏的部分 clientTop表示边框border的厚度在未指定的情况下一般为0 scrollTop滚动后被隐藏的高度获取对象相对于由offsetParent属性指定的父坐标(css定位的元素或body元素)距离顶端的高度。
17.js怎么控制一次加载一张图片加载完后再加载下一张
方法1
script typetext/javascriptvar obj new Image();obj.srchttp://www.phoernote.com/uploadfiles/editor/201107240502201179.jpg;obj.onload function(){alert(图片的宽度为obj.width;图片的高度为:obj.height);document.getElementById(mypic).innerHTML img src this.src /;}
/script
div idmypiconloading....../div方法2
script typetext/javascriptvar obj new Image();obj.srchttp://www.phpernote.com/uploadfiles/editor/201107240502201179.jpg;obj.onreadystatechange function(){if(this.readyStatecomplete){alert(图片宽度为:obj.width;图片的高度为:obj.height);document.getElementById(mypic).innerHTML img src this.src /}}
/script
div idmypiconloading....../div18.js中的call和apply区别
apply调用一个对象的一个方法用另一个对象替换当前对象 call调用一个对象的一个方法用另一个对象替换当前对象
从定义中可以看出call和apply都是调用一个对象的一个方法用另一个对象替换当前对象而不同之处在于传递的参数apply最多只能由两个参数——新this对象和一个数组argArray如果arg不是数组则会报错。
相同点两个方法产生的作用是完全一样的call apply作用就是借用别人的方法来调用就像调用自己的一样。 不同点方法传递的参数不同
19.请掌握2种以上数组去重的方式
19.1 使用indexof()方法
19.2 使用lastIndexof()方法和indexof()方法一样indexof()从头部开始匹配lastIndexof()从尾部开始匹配
19.3 es6的set结构set不接受重复数据
19.4使用sort方法先将原数组排序然后与相邻的比较如果不同则存入新数组
19.5 使用filter和indexof()方法
19.6 使用es6的set和扩展运算符
19.7 使用set和Array.from() 方法array.from()可以将set结构转成数组
19.8 用splice和双层循环
19.9 使用includes方法
20. http协议和https区别
http是超文本传输协议信息是明文传输https是具有安全性的ssl解密传输协议 http和https连接方式完全不同端口也不同http是80https是443 http的连接很简单是无状态的https协议是由sslhttp协议构建的可进行加密传输身份认证的网络协议比http协议安全
21. http状态码
21.1 200:成功
21.2 204服务器成功处理了请求但没有返回任何实体内容可能会返回新的头部元信息
21.3 404请求失败客户端请求的资源没有找到或者是不存在
21.4 500服务器遇到未知的错误导致无法完成客户端当前的请求
21.5 503服务器由于临时的服务器过载或者是维护无法解决当前的请求
22. vue的核心
vue是一套构建用户界面的渐进式自底向上增量开发的MVVM框架 vue的核心只关注视图层 核心思想 数据驱动视图的内容随着数据的改变而改变 组件化可以增加代码的复用性可维护性可测试性提高开发效率方便重复使用体现了高内聚低耦合
23. vue常用的修饰符有哪些
23.1 .lazy 改变后触发光标离开Input输入框的时候值才会改变
23.2 .number 将输出字符串转为number类型
23.3 .trim 自动过滤用户输入的首尾空格
23.4 .stop 阻止点击事件冒泡相当于原生js中的event.stopPropagation()
23.5 .prevent 防止执行预设的行为相当于原生js中的event.preventDefault()
23.6 .capture 添加事件侦听器时使用事件捕获模式就是谁有该事件修饰符就先触发谁
23.7 .self 只会触发自己范围内的事件不包括子元素
23.8 .once 只执行一次
键盘修饰符
23.9 .enter 回车键
23.10 .tab 制表键
23.11 .esc 返回键
23.12 .space 空格键
23.13 .up 向上键
23.14 .down 向下键
23.15 .left 向左键
23.16 .right 向右键
系统修饰符
23.17 .ctrl .alt .shift .meta
24. vue循环中的key作用
key值的存在保证了唯一性vue在执行时会对节点进行检查如果没有Key值那么vue检查到这里有dom节点就会对内容清空并赋新值如果有key值存在那么会对新老节点进行对比比较两者key是否相同进行调换位置或删除操作。
25. vue中路由的跳转方式(声明式/编程式)
vue中路由跳转有两种分别是声明式和编程式
用js方式进行跳转的叫编程式导航 this.$router.push()
用router-link 进行跳转的叫声明式 router-view路由出口路由模板显示的位置
路由中的name属性有什么作用 在router-link中使用name导航到对应路由 使用name导航的同时给子路由传递参数
26.vue路由模式hash和history
hash 模式地址栏中有#history没有history模式下刷新会出现404情况需要后台配置 使用javascript来对location.hash进行配置改变url的hash值 可以使用hashChange事件来监听hash值的变化 html5提供了history api来实现 url的变化其中最主要的api有以下两个history.pushState()和history.replaceState(0。这两个api可以在不进行刷新的情况下操作浏览器的历史记录唯一不同的是前者是新增一个历史记录后者是直接替换当前的历史记录。
27. mvvm和mvc的区别
mvc模型视图控制器视图是可以直接访问模型所以视图里面会包含模型信息mvc关注的是模型不变所以在mvc中模型不依赖视图但是视图依赖模型。 mvvm 模型 视图 和vm vm是作为模型和视图的桥梁当模型层数据改变vm会检测到并通知视图层进行相应的修改