1、隐藏元素的几种方法
display:none;
visibility:hidden;
opacity:0;
position:absolute; left:-1000;
2、回答以下输出的类型
alert(typeof(“undefined”));//string
alert(NaN == undefined);//false
alert(NaN == NaN);//false
alert(typeof(null));//object
alert(typeof(NaN));//number
alert(typeof(undefined));//undefined
3、浏览器页面有哪三层构成,分别是什么,作用是什么?
- 浏览器页面构成:结构层、表示层、行为层
- 分别是:HTML、CSS、JavaScript
- 作用:HTML实现页面结构,CSS完成页面的表现与风格,JavaScript实现一些客户端的功能与业务。
4、image和canvas在处理图片的时候有什么区别?
- image是通过对象的形式描述图片的。
- canvas通过专门的API将图片绘制在画布上。
5、响应式布局的时候,轮播图使用两张不同的图片去适配大屏幕和超小屏幕,还是一张图片进行压缩适配不同终端,说明原因?
- 最好使用两张不同大小的图片去适配大屏幕和超小屏幕,这样可以针对不同设备的屏幕大小,来加载响应的图片,减少超小屏幕设备的网络流量消耗,加快响应速度,同时防止图片在大屏幕下分辨率不够导致失真的问题。
6、简述同步和异步的区别
- 同步是阻塞模式,异步是非阻塞模式。
- 同步就是指一个进程在执行某个请求的时候,若该请求需要一段时间才能返回信息,那么这个进程将会一直等待下去,直到收到返回信息才继续执行下去;
- 异步是指进程不需要一直等下去,而是继续执行下面的操作,不管其他进程的状态。当有消息返回时系统会通知进程进行处理,这样可以提高执行的效率。
7、用jquery和原生js获取元素中的内容
//JS
document.getElementById(“div1”).innerHTML;
document.querySelector(“#div1”).innerText;
//JQ:
$(“#div1”).html()
8、Ajax的原理
- Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据,然后用javascript来操作DOM而更新页面。
- XMLHttpRequest是ajax的核心机制,它是在IE5中首先引入的,是一种支持异步请求的技术。简单的说,也就是javascript可以及时向服务器提出请求和处理响应,而不阻塞用户。达到无刷新的效果。
9、如何通过stream实现一个文件的复制
var fs = require("fs");
var rs = fs.createReadStream(“1.jpg");
var ws = fs.createWriteStream("2.jpg");
rs.pipe(ws);
10、什么是语义化的HTML?
- 直观的认识标签,对于搜索引擎的抓取有好处,用正确的标签做正确的事情!
- html语义化就是让页面的内容结构化,便于对浏览器、搜索引擎解析,在没有样式CCS情况下也以一种文档格式显示,并且是容易阅读的。搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重,利于SEO。使阅读源代码的人对网站更容易将网站分块,便于阅读维护理解。
11、用原生js封装一个添加监听事件的兼容写法
function addEvent(obj,event,fn){
//现代:addEventLister 不用加on
//ie:touchEvent 需要加on
if (window.addEventListener){
obj.addEventListener(event,fn);
}else{
obj.attachEvent("on"+event, fn);
}
}
12、什么叫优雅降级和渐进增强?
- 优雅降级:
Web站点在所有新式浏览器中都能正常工作,如果用户使用的是老式浏览器,则代码会检查以确认它们是否能正常工作。由于IE独特的盒模型布局问题,针对不同版本的IE的hack实践过优雅降级了,为那些无法支持功能的浏览器增加候选方案,使之在旧式浏览器上以某种形式降级体验却不至于完全失效。 - 渐进增强:
从被所有浏览器支持的基本功能开始,逐步地添加那些只有新式浏览器才支持的功能,向页面增加无害于基础浏览器的额外样式和功能的。当浏览器支持时,它们会自动地呈现出来并发挥作用。
13、闭包是什么?优缺点?
- 闭包:能够读取其他函数内部变量的函数。(应用场景:要获取某函数内部的局部变量)
- 闭包的优点:
1.能够读取函数内部的变量
2.让这些变量一直存在于内存中,不会在调用结束后,被垃圾回收机制回收 - 闭包的缺点:
正所谓物极必反,由于闭包会使函数中的变量保存在内存中,内存消耗很大,所以不能滥用闭包,解决办法是,退出函数之前,将不使用的局部变量删除。
14、描述URI和URL区别?
- URI标记了一个网络资源,仅此而已; URL标记了一个WWW互联网资源(用地址标记),并给出了他的访问地址。
- URL是URI的子集,所有的URL都是URI,但不是每个URI都是URL,还有可能是URN
15、import,require区别?
- require是在运行时加载,而import是在编译时加载
- 规范不同,require是CommonJS/AMD规范,import是ESMAScript6+规范
16、如何防止Cookie不安全?如何阻止XSS攻击?
- Cookie:将cookie的内容进行加密,加密后的内容在加入随机数
- xss:将能被转换为html的输入内容,再写代码时改为innerText ,而不使用inner HTML
17、给出一个对象遍历属性值
for(var k in obj){}
18、使用node构建一个服务器并对向”/post”发起的post请求进行处理,要求拿到post请求传输的数据(不包括文件上传)
var http = require("http");
var queryString = require("querystring");
var server = http.createServer(function (req,res) {
if(urlObj.pathname == "/post"){
var str = "";
req.on("data",function (chunk) {
str+=chunk;
});
req.on("end",function () {
var query = queryString.parse(str);
console.log(query);
})
res.end("你请求的地址是"+urlObj.pathname);
}
});
server.listen(8080);
19、px和em的区别?
- px和em都是长度单位,区别是,px的值是固定的,指定是多少就是多少,计算比较容易。em得值不是固定的,并且em会继承父级元素的字体大小。
- 浏览器的默认字体高都是16px。所以未经调整的浏览器都符合: 1em=16px。那么12px=0.75em, 10px=0.625em
20、解释jsonp的原理,以及为什么不是真正的ajax?
- 动态创建script标签,回调函数
- Ajax是页面无刷新请求数据操作
21、Javascript的事件流模型都有什么?
- “事件冒泡”:事件开始由最具体的元素接受,然后逐级向上传播
- “事件捕捉”:事件由最不具体的节点先接收,然后逐级向下,一直到最具体的
- “DOM事件流”:三个阶段:事件捕捉,目标阶段,事件冒泡
22、回答以下代码,alert的值分别是多少?
<script>
var a = 100;
function test(){
alert(a);
a = 10; //去掉了var 就变成定义了全局变量了
alert(a);
}
test();
alert(a);
</script>
答案: 100, 10, 10
23、javaScript的2种变量范围有什么不同?
- 全局变量:当前页面内有效
- 局部变量:函数方法内有效
24、看下面代码,给出输出结果。
for(var i = 1; i <= 3; i++){
//建议使用let 可正常输出i的值
setTimeout(function(){
console.log(i);
},0);
};
答案:4 4 4。
原因:Javascript事件处理器在线程空闲之前不会运行
25、js延迟加载的方式有哪些?
- defer和async、动态创建DOM方式(创建script,插入到DOM中,加载完毕后callBack)、按需异步载入js