1、选择器权重。
！important > 行内样式 > id选择器>class | 属性选择器>标签选择器>通配符
2、什么是Margin塌陷/合并？
Margin塌陷：子元素设置了浮动，子元素会完全脱离文档流此时将会导致子元素无法撑开父元素的高度，导致父元素高度塌陷。
Margin合并：块级元素的上外边距或下外边距直接接触/相邻时，会合并为一个外边距，这种合并行为叫做margin合并。
3、什么是bfc？列举出几种触发bfc的方式
- bfc:块级格式化上下文
- bfc触发方式：
float属性不为none
position为absolute或fixed
display为inline-block, table-cell, table-caption, flex, inline-flex
overflow不为visible
4、position的属性有哪几个，relative与absolute的用法和区别
- position:absolute、fixed、relative、static、inherit
absolute:相对于 static 定位以外的第一个父元素进行定位。
fixed:生成绝对定位的元素，相对于浏览器窗口进行定位。
relative:生成相对定位的元素，相对于其正常位置进行定位。
static:没有定位，元素出现在正常的流中.
inherit:规定应该从父元素继承 position 属性的值。
5、只用一条CSS代码表示浏览器一半的宽度
width:50%vm;
- vm,vh,vmin,vmax
vm是相对于视口宽度百分比的单位，1vw = 1% viewport width。vh是相对于视口高度百分比的单位。1vh = 1% viewport height。vmin是相对当前视口宽高中较小的一个的百分比单位。vmax是相对当前视口宽高中较大的一个的百分比单位。
6、form中的input可以设置为readonly和disable，请问二者有什么区别？
- disabled:指当input元素加载时禁用此元素，disabled=true时，无法修改内容，input内容不会随着表单被提交。
（下图图左为设置了disabled=true）
- readonly:规定输入字段为只读，readonly=true时，页面上无法修改内容，但是可以通过JavaScript修改，input内容会随着表单提交.
（下图图右为设置了readonly=true）
disabled设为true，该表单输入项不能获取焦点，用户的所有操作（鼠标点击和键盘输入等）对该输入项都无效，最重要的一点是当提交表单时，这个表单输入项将不会被提交。
readonly只是针对文本输入框这类可以输入文本的输入项，如果设为true，用户只是不能编辑对应的文本，但是仍然可以聚焦焦点，并且在提交表单的时候，该输入项会作为form的一项提交。
7、transform有哪些用法？（至少写出两个）
translate(x,y):水平移动Xpx，垂直移动Ypx。
scaleX(x)：通过设置 X 轴的值来定义缩放转换。
scaleZ(z)：通过设置 Z 轴的值来定义 3D 缩放转换。
translate3d(x,y,z) ：定义 3D 转换。
rotate(angle)：定义 2D 旋转，在参数中规定角度。
rotate3d(x,y,z,angle)：定义 3D 旋转。
skew(x-angle,y-angle)：定义沿着 X 和 Y 轴的 2D 倾斜转换。
perspective(n)：为 3D 转换元素定义透视视图。
8、在标准盒模型和ie盒模型下两个盒子的宽度和高度是多少？
<div class="first" style="width: 200px;height: 200px; margin: 20px 20px 30px; padding: 20px 30px; border:1px solid black;">
<div class="second" style="width: 100px;height: 100px;margin: 10px 20px;border: 1px solid black;"></div>
</div>
- 第一个盒子：
标准盒模型：width:200px;height:200px
ie盒模型：width:262px;height:242px; - 第一个盒子：
标准盒模型：width:200px;height:100px;
Ie盒模型：width:102px;height:102px;
9、阻止冒泡和默认事件的方法
（1）阻止冒泡：
w3c的方法是e.stopPropagation()，IE则是使用e.cancelBubble = true。
依次触发alert(“li”),alert(“ul”),alert(“div”)，这就是事件冒泡。
<div id='div' οnclick='alert("div");'>
<ul οnclick='alert("ul");'>
<li οnclick='alert("li");'>test</li>
</ul>
</div>
window.event?event.cancelBubble=true:event.stopPropagation();
（2）默认事件
reventDefault它是事件对象(Event)的一个方法，作用是取消一个目标元素的默认行为。既然是说默认行为，当然是元素必须有默认行为才能被取消，如果元素本身就没有默认行为，调用当然就无效了。如链接< a>，提交按钮< input type=”submit”>等。当Event 对象的 cancelable为false时，表示没有默认行为，这时即使有默认行为，调用preventDefault也是不会起作用的。
<a href="http://caibaojian.com/" id="testA" >caibaojian.com</a>
var a = document.getElementById("testA");
a.onclick =function(e){
if(e.preventDefault){
e.preventDefault();
}else{
window.event.returnValue == false;
}
}
10、写出下列打印的值
function fn(a){
console.log(a);
var a = 123;
console.log(a);
function a(){};
console.log(a);
var b = function(){};
console.log(b);
function c(){};
}
fn(1);
打印结果：
f a(){
}
123
123
f (){
}
11、写出下列函数的i的返回值
function createFunctions() {
var result = new Array();
for (var i = 0;i<10;i++){
result[i] = function () {
return i;
}
}
return result;
}
打印结果：
10、10、10、10、10、10、10、10、10、10
分析：变量升级
12、写出下列结果：
var a = [34,4,3,54],
b = 34,
c = 'adsfas',
d = function(){
console.log('我是函数')},
e = true,
f = null,
g;
console.log(typeof(a)); //object
console.log(typeof(b)); //number
console.log(typeof(c)); //string
console.log(typeof(d)); //function
console.log(typeof(e)); //boolean
console.log(typeof(f)); //object
console.log(typeof(g)); //undefined
console.log(typeof(j)); //undefined
alert(h); //报错error
13、写出获取DOM元素的方法（至少写出4种）
document.getElementById();
document.getElementsByClassName()[0];
document.getElementsByTagName()[0];
document.querySelectorAll();
docuemnt.querySelector();通过合法的CSS选择器来获取
DOM元素（只会获取第一个匹配的元素），
14、以下代码的结果是？
var a = 10;
var b = 20;
var c = 10;
alert(a = b);
alert(a == b);
alert(a == c);
结果：
10
true //此时a是20了，和b一样
false
15、js中SetInterval与setTimeout的区别？
（1）SetInterval：间歇调用，按照指定的周期（以毫秒计）来调用函数或计算表达式。
（2）setTimeout：用于在指定的毫秒数后调用函数或计算表达式。
16、Get和post的区别？
最直观的区别就是GET把参数包含在URL中，POST通过request body传递参数。
（1）GET请求只能进行url编码，而POST支持多种编码方式。
（2）GET请求参数会被完整保留在浏览器历史记录里，而POST中的参数不会被保留。
（3）GET请求在URL中传送的参数是有长度限制的，而POST么有。
（4）对参数的数据类型，GET只接受ASCII字符，而POST没有限制。
（5）GET比POST更不安全，因为参数直接暴露在URL上，所以不能用来传递敏感信息。
17、写出下列代码的打印值
function Person(person){
person.age = 18;
person ={
name:‘xxxxx’,
age:10
}
return person
}
let person = {
name:‘yyyyy’,
age:12
}
console.log(Person(person))
打印结果：
{
name:"XXXXX"age:10}
18、写出下列http状态码的含义
1**：信息，服务器收到请求，需要请求者继续执行操作
2**：成功，操作被成功接收并处理
3**：重定向，需要进一步的操作以完成请求
4**：客户端错误，请求包含语法错误或无法完成请求
5**：服务器错误，服务器在处理请求的过程中发生了错误
19、只用css实现一个如图所示的三角形（不用css3）
.arrow{
width:0;
height:0;
border-left:30px solid transparent;
border-right:30px solid transparent;
border-bottom:30px solid red;
}
<div class="arrow"></div>
20、用js递归的方式写1到100求和？
function sum(n){
if(n==1) return 1;
return sum(n-1)+n;
}
alert(sum(100)); //5050