2018前端面试题（二）
九、元素隐藏的几种方法
（1)opacity: 0 ;
通过改变元素的透明度，从视觉上来隐藏元素，但是元素本身依然占据它自己的位置，并对网页的布局起作用，也能相应用户的交互；
（2）visibility: hidden ;
同opacity相同，元素本身依然占据它自己的位置，并对网页的布局起作用，不同的是不会对交互起作用。
（3）display: none ;
被隐藏的元素不占任何空间，一旦display设置成none，任何对该元素的交互作用都不起作用，且读屏软件读不到该元素的内容，这种方式产生的效果就好像元素完全不存在，它的任何状态值的切换总是立即生效。
通过DOM依然可以访问到该元素，通过DOM可以直接操作它。
（4）position
将元素移除可视区域，
position:absolute;
left:-9999px;
top:-9999px;(5)clip-path：通过裁剪的方法隐藏元素
.hide {
clip-path: polygon(0px 0px,0px 0px,0px 0px,0px 0px);
}十、数组去重的方法
第一种方法：使用es5中的indexOf进行去重
function arr1(){
var n=[];
for(var i=0;i<arr.length;i++){
if(n.indexOf(arr[i])==-1){
n.push(arr[i]);
}
}
return n;
}//先定义一个空数组，然后遍历数组，使用indexOf检查是否含有重复元素，如果没有则插入到n中。使用此类方法应考虑ES5的兼容性问题第二种方法：先排序后在相邻比较去重，此方法比第一种方法效率好
function arr3(){
arr.sort();
var re=[arr[0]];
for(var i=1;i<arr.length;i++){
if(arr[i]!==re[re.length-1]){
re.push(arr[i]);
}
}
return re;
}第三种方法：使用map去重
function arr4(arr){
var map={};
if(arr&&Array.isArray(arr)){
for(var i=arr.length;i>=0;--i){
if(arr[i] in map){
arr.splice(arr[i],1);
}else{
map[arr[i]] = true;
}
}
}
return arr;
}十一、判断对象是否存在的方法
第一种方法：JavaScript语言是先解析后运行，在解析过程中完成变量提升，然后做判断（除了对象是否存在，还要判断对象是否为null值时，推荐使用该方法）：
if (!myObj) {
var myObj = { };
}
第二种方法：window是JavaScript的顶层对象，所有全局变量都是它的属性；
if (!window.myObj) {
var myObj = { };
} 第三种方法：在某些环境中（如V8、Rhino），window未必是顶层对象，可以改为下面写法：
if (!this.myObj) {
this.myObj = { };
}this关键词总是指向顶层变量，所以就可以独立不同的运行环境。
第四种方法：this的指向是可变的，进而可以改为：
var global = this;
if (!global.myObj) {
global.myObj = { };
}第五种方法：通过typeof运算符，判断myObject是否有意义（仅判断对象是否存在，推荐使用）：
if (typeof myObj == "undefined") {
var myObj = { };
}第六种方法：使用运算符in判断myObject是否为顶层对象的一个属性：
if (!('myObj' in window)) {
window.myObj = { };
} 第七种方法：使用hasOwnProperty，判断myObject是否为顶层对象:
if (!this.hasOwnProperty('myObj')) {
this.myObj = { };
}十二、超链接样式被点击后样式不起作用，如何解决？
定义css的顺序：link-visited -hover-active
十三、前端应该从那几个方面来优化网站
（1）减少外部http请求
（2)压缩css、js和html
(3)使用cdn和缓存提高速度
（4）压缩文件
（5）使用css Sprites
（6）使用轻量级框架
(7)使用懒加载或预加载
（8）减少DOM操作
十四、前端如何实现SEO优化
（1）利用meta定义关键词、网站描述等；
（2）前景图片<img >添加alt属性
（3)前景图片要定义大小，不然会造成页面重新渲染，影响加载速度
（4）适当 的给a标签添加rel = "noflow"属性
（5）内联使用绝对路径，减少服务器响应时间
（6）导航栏的层级不宜过多
（7)使用Svg，因为svg的源文件是一个文本文件，有利于访问
（8）语义化书写HTML代码，符合W3C标准