1、盒子模型介绍
2、行内元素，块元素，空元素有哪些？
3、实现垂直水平居中
4、移动端兼容性问题，代表性
5、在flex布局中实现文字超过4行出现省略号-超长文本自动换行
6、自适应布局的局限性
7、如何判定一个元素是真正的object类型
8、axios给所以请求的header加额外参数
9、display:none和visibility:hidden区别
10、EventBus的使用
11、forEach和map的区别
12、call()、apply()、bind()如何使用
1、盒子模型介绍
每一个盒模型都包含 content padding border margin
1.标准盒子模型中content中包含content
2.IE盒子模型中content中包含content、padding、border
image.png
2、行内元素，块元素，空元素有哪些？
行内元素：span a b i
块元素：div ul li ol h1-h5 p table
空元素：br，hr，img，input，link，meta
3、实现垂直水平居中
1、通过margin:auto;
2、flex布局
3、定位
4、移动端兼容性问题，代表性
ios的日期'-'改为'/'
5、在flex布局中实现文字超过4行出现省略号-超长文本自动换行
6、自适应布局的局限性
7、如何判定一个元素是真正的object类型
8、axios给所以请求的header加额外参数
image.png
9、display:none和visibility:hidden区别
他们两个都是关于页面隐藏的，但是用visibility:hidden隐藏之后还会占用未隐藏的时候的空间
1、visibility具有继承性，给父元素设置visibility:hidden;子元素也会继承这个属性。但是如果重新给子元素设置visibility: visible,则子元素又会显示出来。这个和display: none有着质的区别
2、visibility: hidden不会影响计数器的计数
3、CSS3的transition支持visibility属性，但是并不支持display，由于transition可以延迟执行，因此可以配合visibility使用纯css实现hover延时显示效果。提高用户体验。
10、EventBus的使用
创建
import Vue from 'vue'
export const EventBus = new Vue()
发送事件
<!-- A.vue -->
<template>
<button @click="sendMsg()">-</button>
</template>
<script>
import { EventBus } from "../event-bus.js";
export default {
methods: {
sendMsg() {
EventBus.$emit("aMsg", '来自A页面的消息');
}
}
};
</script>
接受事件
<!-- IncrementCount.vue -->
<template>
<p>{{msg}}</p>
</template>
<script>
import {
EventBus
} from "../event-bus.js";
export default {
data(){
return {
msg: ''
}
},
mounted() {
EventBus.$on("aMsg", (msg) => {
// A发送来的消息
this.msg = msg;
});
}
};
</script>
11、forEach和map的区别
1、forEach()返回值是undefined，不可以链式调用。
2、map()返回一个新数组，原数组不会改变。
3、没有办法终止或者跳出forEach()循环，除非抛出异常，所以想执行一个数组是否满足什么条件，返回布尔值，可以用一般的for循环实现，或者用Array.every()或者Array.some();
12、call()、apply()、bind()如何使用
call()、apply()、bind() 都是用来重定义 this 这个对象的！
call 的参数是直接放进去的，用，隔开，放到后面
网友评论