前端开发 JavaScript笔试题 前端开发笔试题及答案

1: 请实现，鼠标点击页面中的任意标签，alert该标签的名称．（注意兼容性）
   document.onclick = function(e){
       var e = e||event;
       var o = e['target'] || e['srcElement'];  //srcElement/target：事件源，就是发生事件的元素； FF下是target，IE下是srcElement
       alert(o.tagName.tolowerCase());
   }

2: 请指出一下代码的性能问题，并经行优化
   var info="腾讯拍拍网（www.paipai.com）是腾讯旗下知名电子商务网站。"; 
   info +="拍拍网于2005年9月12日上线发布，";  
   info +="2006年3月13日宣布正式运营，";           //仔细观察info这个变量，发现它每次都要自加字符串，如果字符串很大的又很多的话会非常影响性能的
   info +="是目前国内第二大电子商务平台。";  
   info=info.split(",");  
   for(var i=0; i<info.length; i++)  {      
          alert(info[i]);
       }

       优化方案：
       //对于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);
       //对处理大字符串连接问题都可以采取这种思路

3:  请给出异步加载js方案，不少于两种。
     1.defer    (仅限于IE)
     2.async   (Html5的script标签的属性)
     3.创建script，引进脚本文件
     function loadScript(url,callback){
         var script = document.createElement('script');
         script.type = 'text/javascript';
         script.src = url;
         document.body.appendChild(script);
         if(script.readyState){
             script.onreadystatechange = function(){
                 if(script.readyState == 'loaded' || script.readyState == 'complete'){
                     script.onreadystatechange = null;
                     callback();
                 }
             }
         }else{
             script.onLoad = function(){
                 callback();
             }
         }

     }

4:  请写出jQuery绑定事件的方法，不少于两种
    $().bind()    //jQuery 扫描文档找到所有 $(‘a’) 元素，然后给每一个找到的元素的 click 事件绑定处理函数。
    $('a').live('click', function() { alert("That tickles!") }); //jQuery绑定处理函数到 $(document) 元素，并把 ‘click’ 和 ‘a’ 作为函数的参数。有事件冒泡到document节点的时候，检查这个事件是不是 click 事件，target element能不能匹配 ‘a’ css选择器，如果两个条件都是true，处理函数执行
    $('#container').delegate('a', 'click', function() { alert("That tickles!") });  //jQuery扫描文档找到 $(‘#container’)，绑定处理函数到他的 click 事件，’a’ css选择器作为函数的参数。当有事件冒泡到 $(‘#container’)，检查事件是不是 click，并检查target element是不是匹配css选择器，如果两者都符合，执行函数。
    综上，$(‘a’).live()与$(document).delegate(‘a’)很相似，很小的地方还是有不同，delegate的效率高一点
 
5： 请设计一套方案，用于确保页面中JS加载完全。