前端基础知识精讲-优快云博客

本文链接：https://blog.youkuaiyun.com/ALSNEI/article/details/60137055

第二弹
笔试题

一

1.

①行内元素：占位不能充满正行的元素，不能设置宽高，宽高由内容撑开，只能容纳行内元素。

例如：
     span - 常用内联容器，定义文本内区块 
     em - 强调 
     strong - 粗体强调
     img - 图片   
     input - 输入框 
     ...

②块级元素：占位充满正行的元素，可以设置宽高，可以容纳任何元素

例如：
     span - 常用内联容器，定义文本内区块 
     em - 强调 
     strong - 粗体强调
     img - 图片   
     input - 输入框 
     ...

③空元素：没有内容的元素，即单标签，

例如：
     br - 换行
     hr - 水平分割线
     ...

补充④行内块元素：占位没有充满正一行，宽高可以设置，可以容纳任意元素标签

例如：
     img - 图片
     input - 输入框
     ...

2.

CSS 引入方式差异看这里，看这里

3.

常用浏览器内核看这里

4.

cookie、sessionStorage和localStorage区别看这里

5.

①title和h1区别：
title标题是给搜索引擎看的，h1标签的内容是给用户看的。
一个页面也可以拥有多个h1，但会稀释主题，不利于搜索引擎搜索，所以通常一个好的网站的一个页面只有一个h1，同时拥有一个title，网站的所有单页都可以拥有一个title，这样有利于SEO优化，另外title的权重高于h1，其适用性要比h1广

②b和strong的区别
b代表bold(粗体)，strong代表强调，强调的默认表现形式就是加粗字体，所以两者在表现形式上一样，有文章说strong有利于SEO优化，实际上两者并没有什么显著的差异。

③i和em区别
em 强调文本，通常以斜体渲染，i 指定文本应以斜体渲染，若可用的话。两者的区别和上面的一样，表现形式一样，但是意义不同。

二

1.

源于W3C

2.

源于W3C

3.

CSS初始化是为了考虑到浏览器的兼容问题，其实不同浏览器对有些标签的默认值是不同的，如果没对CSS初始化往往会出现浏览器之间的页面差异。当然，初始化样式会对SEO有一定的影响，但鱼和熊掌不可兼得，但力求影响最小的情况下初始化。

4.

方法：1利用viewport适应屏幕宽高

<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

通过@media 控制字体，单位用rem

方法2：通过切换CSS 样式表

<link rel=”stylesheet” type=”text/css” media=”screen and (min-width: 400px) and (max-device-width: 600px)” href=”smallScreen.css” />

5.

兼容不同屏幕大小终端的网页设计，即可以在不同终端都有完美的网页展示。响应式设计的基本原理即：通过@media媒体查询，动态的改变网页内个元素的样式。

三

1.

js中有5种数据类型：

//基本的数据类型
"boolean"---布尔值
"string" ---字符串
"number"----数值
"undefine"--未定义
"null"------空
//复杂的数据类型
"object" ---对象

2.

call, apply都属于Function.prototype的一个方法,它是JavaScript引擎内在实现的,因为属于Function.prototype,所以每个Function对象实例,也就是每个方法都有call, apply属性.既然作为方法的属性,那它们的使用就当然是针对方法的了.这两个方法是容易混淆的,因为它们的作用一样,只是使用方式不同.

相同点:两个方法产生的作用是完全一样的
不同点:方法传递的参数不同

function.apply(thisObj,argArray)
function.call(thisObj,arg1,arg2,…)
第一个参数：应用或者调用的对象，两者没差别
第二个参数：apply接收的是数组 argArray，而call接收的是一个一个的参数

3.

源于W3C

4.

“use strict” 指令在 JavaScript 1.8.5 (ECMAScript5) 中新增。IE6,7,8,9均不支持严格模式。它不是一条语句，但是是一个字面量表达式，在 JavaScript 旧版本中会被忽略。

“use strict” 的目的是指定代码在严格条件下执行。严格模式下你不能使用未声明的变量。

为什么使用严格模式:
消除Javascript语法的一些不合理、不严谨之处，减少一些怪异行为; 消除代码运行的一些不安全之处，保证代码运行的安全；
提高编译器效率，增加运行速度；
为未来新版本的Javascript做好铺垫。

5.

Cookie在访问对应域名下的资源的时候都会通过Http请求发送到服务器，但是在访问一些资源（例如js脚本，css和图片）的时候，大多数情况下这些Cookie是多余的，所以我们可以通过使用不同的主机来存储一些静态资源，例如用专门的主机来存储图片，这样访问这些资源的时候就不会发送多余的Cookie，从而提高响应速度。

四

1.

var arr = [98,87,85,53,67,99,90];
var max = Math.max.apply(null,arr);
var index = 0;
for (var i = 0; i < arr.length; i++) {
    if(max === arr[i]){
        index = i
    }
};
document.write(index);

2.

二分法只用于有序数组，如果进行了排序，这样查找出来的下标又不是题目要的答案，所以不懂此题意义何在。

//排序后获取的下标，不知是否为所需的
var arr = [98,87,85,53,67,99,90]; 
for(var i=0;i<arr.length;i++){
    for(var j = i + 1;j<arr.length;j++){
        if(arr[i]>arr[j]){
            var tmp = arr[i];
            arr[i] = arr[j];
            arr[j] = tmp;
        }
    }
}
function binarySearch(data,item,start,end){
    var end=end || data.length-1;
    var start=start || 0;
    var m=Math.floor((start+end)/2);
    if(item==data[m]){
        return m;
    }else if(item<data[m]){
        return binarySearch(data,item,start,m-1) //递归调用
    }else{
        return binarySearch(data,item,m+1,end);
    }
    return false;
}

    console.log(binarySearch(arr,67));