腾讯HTML试题
Posted 夜未央leo
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了腾讯HTML试题相关的知识，希望对你有一定的参考价值。
1 请实现，鼠标点击页面中的任意标签，alert该标签的名称.(注意兼容性)
<head>
<script type="text/javascript">
document.onclick = function(e){
e=e||window.event;
var o= e.srcElement||e.target;
alert(o.tagName);
}
</script>
</head>
<body>
<p>蜘蛛</p>
<div>蜘蛛侠</div>
<a href="#">我的</a>
</body>
2 请指出一下代码的性能问题，并经行优化。
var info="腾讯拍拍网(www.paipai.com)是腾讯旗下知名电子商务网站。";
info +="拍拍网于2005年9月12日上线发布，";
info +="2006年3月13日宣布正式运营，";
info +="是目前国内第二大电子商务平台。";
info=info.split(",");
for(var i=0; i
{
alert(info[i]);
}
这题初看纯属折腾，因为后面要根据逗号分隔再alert每项，何不构造一个数组对象来存放文本内容，而要用个临时变量info才存放。
如var info=["腾讯拍拍网(www.paipai.com)是腾讯旗下知名电子商务网站。","拍拍网于2005年9月12日上线发布，","2006年3月13日宣布正式运营，","是目前国内第二大电子商务平台。"] 。可是后来想如果是优化的话这个题目就出的没意义了。
仔细观察info这个变量，发现它每次都要自加字符串，如果字符串很大的又很多的话会非常影响性能的。
对于js中的string类型，属于基本类型，因此一般情况下他们是存放在栈上的。如果字符串很大，info会每次变成一个很长的字符串，会很慢。
如果用引用类型数组来存放则好很多，如：
var temp=[];
temp.push("腾讯拍拍网(www.paipai.com)是腾讯旗下知名电子商务网站。");
//temp只是一个指向堆上数组的指针
temp.push("拍拍网于2005年9月12日上线发布，");
temp.push("2006年3月13日宣布正式运营，");
temp.push("是目前国内第二大电子商务平台。");
temp.join("");
alert(temp);
最后一招temp.join(“”)搞定。对处理大字符串连接问题都可以采取这种思路。
3 请给出异步加载js方案，不少于两种。
异步加载方式：
(1) defer，只支持IE
(2) async：html5中script标签才有的属性
(3) 创建script，插入到DOM中，加载完毕后callBack，见代码：
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);
}
4 请写出jQuery绑定事件的方法，不少于两种。
$("#obj").click(function(){});
$("#obj").change(function(){});
$("#obj").bind("click",function(){});
$("#obj").live("submit",function(){});
5 请设计一套方案，用于确保页面中JS加载完全。
var n = document.createElement("script");
n.type = "text/javascript";
//以上省略部分代码
//ie支持script的readystatechange属性
if(ua.ie){
n.onreadystatechange = function(){
var rs = this.readyState;
if(‘loaded‘ === rs || ‘complete‘===rs){
n.onreadystatechange = null;
f(id,url); //回调函数
}
};
//省略部分代码
//safari 3.x supports the load event for script nodes(DOM2)
n.addEventListener(‘load‘,function(){
f(id,url);
});
//firefox and opera support onload(but not dom2 in ff) handlers for
//script nodes. opera, but no ff, support the onload event for link
//nodes.
}else{
n.onload = function(){
f(id,url);
};
}
6 请优化某网页的加载速度。
1> 页面精简：去掉html页面不必要的空格、注释，尽量将script和css写在外部文件中。
可以借用第三方工具对页面进行加速。
2> 减少文件数量减少页面上引用的文件数量可以减少HTTP连接数许多JavaScript、CSS文件可以合并最好合并，人家财帮子都把自己的JavaScript.functions和Prototype.js合并到一个base.js文件里去了
3> 减少外部域名文件的引用
4> 优化页面元素加载顺序例如：首先加载页面最初显示的内容和与之相关的JavaScript和CSS，不需要的图片文件放到后面加载，或者引用延迟加载的js
5> 减少页面中inline和JavaScript的数量
6> 不要在table标签中嵌套table标签，不过现在基本上都用div+css了，HTML5也出来了。
7> 检查页面是否有js错误，或者空引用（检查页面有没有502错误），有没有js文件的重复加载
7 对string对象经行扩展，使其具有删除前后空格的方法。
String.prototype.trim =function(){
return this.replace(/(^s*)|(s*$)/g,‘‘);
}
8 完成一个正则表达式，验证用户输入是否身份证号码。
var Expression=/d{17}[d|X]|d{15}/;
var objExp=new RegExp(Expression);
一道腾讯js面试题
题目如下：
f = function() {return true;};
g = function() {return false;};
(function() {
if (g() && [] == ![]) {
f = function f() {return false;};
function g() {return true;}
}
})();
alert(f()); // true or false ?
按网友的描述猜测，这应该是QQ招聘的题目，既考查了ECMAScript知识，又需要被面试者的应用实践，题目本身无标准答案，在不同浏览器下表现不同。
这是一道难度较大，并且出题角度比较刁钻的面试题。
正赶上最近在研究Javascript这部分的内容，便对该题目涉及的考察点进行了更深入的研究。以下给出简单分析。
考察点
对作用域链(scope chain)、执行环境(execution context)、变量对象(variable object)的理解
命名函数表达式，参见这里
以上知识点在不同浏览器(主要为：IE和Firefox)的实现差异
相等操作符的隐式类型转换规则
首先，代码简化为(1)：
f = function() {return true;};
g = function() {return false;};
(function() {
alert(g());
function g() {return true;}
})();
上面的例子中，当控制器进入匿名函数的执行环境后，初始化活动对象，函数声明g被放到了执行环境的变量对象集合中，property为g，值为g函数对象，当执行g()，返回true。
将上面的代码稍加改变(2)：
f = function() {return true;};
g = function() {return false;};
(function() {
alert(g());
if (true) {
function g() {return true;}
}
})();
上面代码，结果应该与(1)相同，但Firefox处理结果出现了不同返回false，暂且把这看作是Firefox的bug(虽然Firefox不认为这是个Bug)。
分析：在Firefox中，出现在条件语句中的代码块不做活动对象初始化的处理(Firefox把它当作块作用域??)，即把上例的if (true) 修改为 if (false) 结果是一样的。
到此为止，已经可以确定g()执行后的值是true还是false了。
整合一下(3)：
f = function() {return true;};
g = function() {return false;};
(function() {
if (g()) {
alert("能看到这个警告框，说明你的浏览器不是Firefox");
function g() {return true;}
}
})();
继续分解代码(4)：
f = function() {return true;};
g = function() {return false;};
(function() {
f = function() {return false;};
})();
alert(f());
代码运行，无一例外的返回false，这正是我们想要的结果。
然后稍作改变(5)：
f = function() {return true;};
g = function() {return false;};
(function() {
f = function f() {return false;};
})();
alert(f());
经过稍加修改后，这次掉链子的轮到IE了，IE竟然返回了true!!!这是IE的Bug
最后大整合。
我们不仅知道结果，而且知道为啥是这结果了(6)：
f = function() {return true;};
g = function() {return false;};
(function() {
if (g() && [] == ![]) {
f = function f() {return false;};
function g() {return true;}
}
})();
alert(f());
没有问题的浏览器会返回：false
Firefox不会执行到if条件内部，返回：true
IE会执行到if条件内部(但把if内部的f作为局部变量处理了)，最后返回：true
以上是关于腾讯HTML试题的主要内容，如果未能解决你的问题，请参考以下文章