最近想着跳槽，但面试的邀约不多，内心有点烦躁。梳理梳理心情，跳槽季竞争也大，努力做好自己...
21.请设计一套方案，用于确保页面中js加载完全。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>alert标签名</title>
</head>
<body>
<script>
//加载完成后执行回调
function loadScript(url, callback){
var script = document.createElement("script")
script.type = "text/javascript";
if (script.readyState){ //IE
script.onreadystatechange = function(){
if (script.readyState == "loaded" || script.readyState == "complete"){
script.onreadystatechange = null;
callback();
}
};
} else { //Others: Firefox, Safari, Chrome, and Opera
script.onload = function(){
callback();
};
}
script.src = url;
document.body.appendChild(script);
}
loadScript('http://www.taojiaqu.com/resource/public/jquery/jquery-1.11.2.min.js',function(){
alert('ok');
})
</script>
</body>
</html>
22.请优化某页面的加载速度。
1.JS、CSS、HTML做gzip压缩（不要对图片进行Gzip压缩）
2.删除js、css、html文件的注释，回车符，以及无效字节
3.javascript放置网页底部，避免阻塞下载
4.CSS放到header中，避免白屏
5.合并JS和CSS；压缩JS和CSS；
6.优化缓存：对没有变化的css、js，图片等网页元素，直接利用客户端的浏览器缓存读取来有效减少http请求数。
6.通过增加expires header（给文件加上关于过期时间的header报文）可以告诉浏览器，那些网页元素可以缓存和缓存多长时间。
7.采用CSS sprites（CSS Sprites其实就是把网页中一些背景图片整合到一张图片文件中）技术来实现。
8.把脚本和图片放在不同的服务器和域名，做成并行下载。
9.利用H5的缓存技术
23.对 string 对象进行扩展，使其具有删除前后空格的方法。
1.用prototype添加方法
String.prototype.trim=function(){ return this.replace(/(^\s*)|(\s*$)/g, ""); }
2.利用 substring() 函数
String.prototype.deletSpace = function(){ var str = this; //提取需要操作的字符串 while(str[0] == " "){ //删除前面的空格 str = str.substring(1); } while(str[str.length - 1] == " "){ //删除后面的空格 str = str.substring(0,str.length-1); } return str; }
方法还是有的，欢迎举例
24.完成一个正则表达式，验证用户是否输入正确的身份证号码。
var string='35021119920102353X'; var stringExp=new RegExp(/^(\d{15}$|^\d{18}$|^\d{17}(\d|X|x))$/); alert(stringExp.test(string)); //true //15位或18位，如果是15位，必需全是数字 //如果是18位，最后一位可以是数字或字母Xx，其余必需是数字
25.介绍一下CSS的盒子模型。
当IE6~8处于怪异模式下就会使用IE盒子模型，否则将使用W3C标准盒子模型
26.CSS选择符有哪些？哪些属性可以继承？优先级算法如何计算？CSS3新增伪类有哪些？
哪些元素可继承（网站找的，供参考；大致常用的都有了）
不可继承的：display、margin、border、padding、background、height、min-height、max- height、width、min-width、max-width、overflow、position、left、right、top、 bottom、z-index、float、clear、table-layout、vertical-align、page-break-after、 page-bread-before和unicode-bidi。
所有元素可继承：visibility和cursor。
内联元素可继承：letter-spacing、word-spacing、white-space、line-height、color、font、 font-family、font-size、font-style、font-variant、font-weight、text- decoration、text-transform、direction。
终端块状元素可继承：text-indent和text-align。
列表元素可继承：list-style、list-style-type、list-style-position、list-style-image。
表格元素可继承：border-collapse
优先级算法
1.选择器都有一个权值，权值越大越优先；
2.当权值相等时，后出现的样式表设置要优于先出现的样式表设置；
3.创作者的规则高于浏览者：即网页编写者设置的CSS 样式的优先权高于浏览器所设置的样式；
4.继承的CSS 样式不如后来指定的CSS 样式；
5.在同一组属性设置中标有“!important”规则的优先级最大；
css3伪类：
27.如何居中 DIV ?如何居中一个浮动元素？
//绝对定位，负边距（这种方式实际项目中不可以）
.div{width:200px;height: 200px;position:absolute;left:50%;top:50%;margin:-100px 0 0 -100px}
//父元素和子元素同时左浮动，然后父元素相对左移动50%，再然后子元素相对右移动50%，或者子元素相对左移动-50%也就可以了
.div{position: relative;left:50%;float: left;} .con{width:200px;height: 200px;float:left;position:relative;right:50%;background: #000} <div class="div"><div class="con"></div></div>
28.CSS3有哪些新特性？
新的选择器：上方题目有例子
特效：圆角，阴影，渐变，背景，边框背景，元素变形效果，动画，过渡
29.一个满屏 品 字布局 如何设计？
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>alert标签名</title> <style>*{margin:0;padding:0} .top{position: absolute;top:0;bottom: 50%;background:red;width: 100%;} .con{position: absolute;top:50%;bottom: 0;width: 100%;} .left{position: absolute;left:0;top:0;height: 100%;width: 50%;background: #000} .right{position: absolute;right:0;top:0;height: 100%;width: 50%;background: yellow} </style> </head> <body> <div class="top"></div> <div class="con"> <div class="left"></div> <div class="right"></div> </div> </body> </html>
效果：
30.经常遇到CSS的兼容性有哪些？原因，解决方法是什么？
参考前一篇15题
31.为什么要初始化CSS样式
防止不同浏览器，对标签的默认样式设置不同...