今天的笔试题:
1、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.伪类选择器(a: hover, li:nth-child)
可继承的样式:
1.font-size
2.font-family
3.color
4.text-indent
不可继承的样式:
1.border
2.padding
3.margin
4.width
5.height
优先级算法:
1.优先级就近原则,同权重情况下样式定义最近者为准;
2.载入样式以最后载入的定位为准;
3.!important > id > class > tag
4.important 比 内联优先级高,但内联比 id 要高
样式表、内联、important
2、超链接访可过后 hover样式就不出现的问题是什么?如何解決?
当超链接被点击后,经常会出现hover样式效果不显示的问题。解决这个问题其实很简单,只要对超链接的样式属性进行正确的排序即可。
排列顺序如下:
link -> visited -> hover ->action
1
参考设置:
a:link{
color:red;
text-decoration:none;
}
a:visited{
color: blue;
text-decoration: none;
}
a:hover{
color: black;
text-decoration:over line;
}
a:action{
color:black;text-decoration:overline;
}
https://blog.csdn.net/qq_36801966/article/details/78425139
3、Css中可以让文字在垂直和水平方向上重叠的两个属性是什么?
垂直方向:line-height 水平方向:letter-spacing
4、div+css的布局较table布局有什么优点?
5、如果让你来优化web前端性能,你会从哪些方面进行优化?
6、如下代码输出结果是什么?解释原因
var a;
alert(typeof a);
alert(b);
结果:
VM98:3 Uncaught ReferenceError: b is not defined
at <anonymous>:3:7
7、如下代码輸出的结果分别是什么?
undefined == null; //true
1 == true; //true
2 == true; //false
0 == false; //true
0 == ''; //true
NaN == NaN; //false
[] == false; //true
[] == ![] //true
[] == [] //false
8、如下代码輸出的结果是什么?
for (var i = 1; i <= 3; i++) {
setTimeout(function () { console.log(i); }, 0);
}
// 4
// 4
// 4
9、如下代码輸出的结果是什么?
var obj = {
a: 1,
b: function() {console.log(this.a)}
}
var a=2;
var objb = obj.b;
obj.b(); // 1
objb(); // 2
obj.b.call(window); // 2
10、说出以下函数的作用是?空白区域应该填写什么?
//define
(function(window){
function fn(str){
this.str=str;
}
fn.prototype.format = function(){
var arg = ______;
return this.str.replace(_____,function(a,b){
return arg[b]||"";
});
}
window.fn = fn;
})(window);
//use
(function(){
var t = new fn('<p><a href="{0}">{1}</a><span>{2}</span></p>');
console.log(t.format('http://www.alibaba.com','Alibaba','Welcome'));
})();
函数的作用是使用format函数将函数的参数替换掉{0}这样的内容,返回一个格式化后的结果; 第一个空是:arguments 第二个空是:/\{(\d+)\}/ig
11、给 Object 扩展一个方法 clone ,实现深度克隆对象
12、javascript实现二分法查找
/* 不知道他什么意思,那就按照它要查找一个元素是否存在就ok了,按最简单的来处理*/
13、一次完整的HTTP事务是怎样的个过程?
- 域名解析
- 发起TCP的3次握手
- 建立TCP连接后发起http请求
- 服务器响应http请求
- 浏览器得到html代码
- 浏览器解析html代码,
- 并请求html代码中的资源(如js、css、图片等)
- 浏览器对页面进行渲染呈现给用户
14、想实现一个对页面某个节点的拖曳?如何做?(使用原生JS)
回答出概念即可,下面是几个要点 给需要拖拽的节点绑定 mousedown, mousemove, mouseup 事件 mousedown 事件触发后,开始拖拽 mousemove 时,需要通过 event.clientX 和 clientY 获取拖拽位置,并实时更新位置 mouseup 时,拖拽结束 需要注意浏览器边界的情况
参考
15、如果被录用,你期望从工作中获得什么?你觉得前端工程师的价值体现在哪?怎样去体现你对于组织的价值?
网友评论