#page { width: 520px; }

    .nav  { width: 200px; float: right; }

    .main { width: 200px; float: left; padding-left: 110px; }    

    .sub  { width: 100px; float: left; margin: 10px 0 10px -100px; }    

    .main { border: 1px solid #000; }

    .nav, .sub { border: 1px dashed #000; height: 300px; }    

    .sub { height: 280px; }

第5题：

 阅读以下JavaScript代码：

if (window.addEventListener) {

       var addListener = function(el, type, listener, useCapture) {

           el.addEventListener(type, listener, useCapture);

       };

   } else if (document.all) {

       addListener = function(el, type, listener) {

           el.attachEvent("on" + type, function() {

               listener.apply(el);

           });

       };

   }

   

请阐述 a) 代码的功能; b) 代码的优点和缺点; c) listener.apply(el) 在此处的作用; d) 如果有可改进之处，请给出改进后的代码，并说明理由。

 a) 功能：事件注册

b) 优点：跨浏览器，特性探测，性能优化。缺点：document.all

c) 作用：使得IE中listener的this 为 el，与其它浏览器一致

d) 改进：document.all改成window.attachEvent; useCapture的默认

 

第6题：

          请编写一个JavaScript 函数toRGB，它的作用是转换CSS中常用的颜色编码。 要求：

 

alert(toRGB("#0000FF"));          // 输出 rgb(0, 0, 255)

alert(toRGB("invalid"));          // 输出 invalid

alert(toRGB("#G00"));              // 输出 #G00

   

 

function toRGB(color) {

    var regex = /^#([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/

    match = color.match(regex)

    return match ? 'rgb('+parseInt(match[1], 16)+','+parseInt(match[2], 16)+','+parseInt(match[3], 16)+')' : color

}

第7题：

 尝试实现注释部分的Javascript代码，可在其他任何地方添加更多代码（如不能实现，说明一下不能实现的原因）：

var Obj = function(msg){

    this.msg = msg;

    this.shout = function(){

        alert(this.msg);

    }  

    this.waitAndShout = function(){

        //隔五秒钟后执行上面的shout方法

    }

}

 var Obj = function(msg){
    this.msg = msg;
    this.shout = function(){
        alert(this.msg);
    }    
    this.waitAndShout = function(){
        var that = this;
        setTimeout(that.shout, 5000);
        //隔五秒钟后执行上面的shout方法
    }
    return this;
}
Obj("shouting").waitAndShout();

第8题：

 请编写一个JavaScript函数，它的作用是校验输入的字符串是否是一个有效的电子邮件地址。要求： a)   使用正则表达式。 b)   如果有效返回true ，反之为false。

 

var checkEmail  = function(email){

var preg = 

        "(^[a-zA-Z]|^[\\w-_\\.]*[a-zA-Z0-9])@(\\w+\\.)+\\w+$"，,

    pregObj  =new RegExp(preg);

    return pregObj.test(email);

}

第9题：

 请分别列出HTML、JavaScript、CSS、Java、php、python的注释代码形式。

 

// JavaScript 注释

/*

 *   JavaScript 多行注释

 */

/* CSS 注释 */

// Java 注释

/**

 * Java 多行注释

 */

// php 单行注释

# php 单行注释

/**

 * php多行注释

 */

# Python 单行注释

''' 

Python 多行注释

'''

第10题：

 根据下图，编写HTML结构。要求：遵循xHTML 1.0规范且符合Web语义。
 

 

第11题：

 请编写一段JavaScript脚本生成下面这段DOM结构。要求：使用标准的DOM方法或属性。

  

   

  window.onload = function() {
            var div =  document.createElement('div');
            div.id =  "example";
            var p =  document.createElement('p');
            p.className =  "slogan";
            p.innerHTML = '淘！你喜欢';
             div.appendChild(p);
             document.body.appendChild(div);
        }

第12题：

 请用CSS定义p标签，要求实现以下效果: 字体颜色在IE6下为黑色(#000000)；IE7下为红色(#ff0000)；而其他浏览器下为绿色(#00ff00)。

 p{

    color:#0f0;

    _color:#000; /*ie6*/   

}

/*ie7*/

*+html p{

    color:#f00;

}

第13题：

 请简化以下的CSS代码，并给出简单的说明。

div.container {

    width: 500px;

    background-image: url(/img/sprite.png);

        background-repeat: no-repeat;

        background-position: 0px -78px;

}

div.container ul#news-list, div.container ul#news-list li {

    margin: 0px;

    padding: 0px;

}

div.container ul#news-list li {

    padding-left: 20px;

    background-image: url(/img/sprite.png);

        background-repeat: no-repeat;

        background-position: -120px 0px;

}

A {

    font-size: 14px;

        font-weight：bold；

    line-height: 150%;

    color: #000000;

}

 

div.container {

    width: 500px;

    background: url(/img/sprite.png) no-repeat 0 -78px;

}

#news-list, #news-list li {

    margin: 0

    padding: 0;

}

#news-list li {

    padding-left: 20px;

    background: url(/img/sprite.png) no-repeat -120px 0;

}

A {

    font: bold 14px/150%;

    color: #000;

}

    如果div.container和#news-list li背景图合并，使用

 

 

 

    div.container,#news-list

li{ background: url(/img/sprite.png)};

 

 

 

    也正确。

 

 

第14题：

 请编写一个通用的事件注册函数（请看下面的代码）。

function addEvent(element, type, handler)

{

    // 在此输入你的代码，实现预定功能

}

 

function addEvent(element, type, handler)

{

    // 在此输入你的代码，实现预定功能

 

    if (element.addEventListener)

    {

        element.addEventListener(type, handler, false);

    }

    else if (element.attachEvent)     //for IE

    {

        element.attachEvnet(“on” + type, handler);

    }

    else

    {

        element[“on” + type] = handler;

    }

}

第15题：

 下面是个输入框
当没有获取焦点时，显示灰色的提示信息：  
当用户输入时，隐藏提示文字，且恢复为默认色：  
当输入框失去焦点，如果输入为空，需还原提示信息：  
要求： a) 写出HTML和CSS代码 b) 用JavaScript实现功能

     

第16题：

 请给JavaScript的String 原生对象添加一个名为trim 的原型方法，用于截取空白字符。要求

 

alert(" taobao".trim());     // 输出 "taobao"

alert(" taobao ".trim());    // 输出 "taobao"

   

 

String.prototype.trim = function() {          

    return this.replace(/^\s+|\s+$/g, "");     

};

第17题：

 请编写一个JavaScript函数 parseQueryString，它的用途是把URL参数解析为一个对象，如：

 

var url = “http://www.taobao.com/index.php?key0=0&key1=1&key2=2.....”

var obj = parseQueryString(url);

alert(obj.key0)  // 输出0

   

 

function parseQueryString ( name ){

  name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");

  var regexS = "[\\?&]"+name+"=([^&#]*)";

  var regex = new RegExp( regexS );

  var results = regex.exec( window.location.href );

  if( results == null )

    return "";

  else

    return results[1];

}

第18题：

请指出下面代码中不符合xHTML 1.0规范的地方，说明理由，并写出改善后的代码：

  

小明的表白

        

小明说：

        

”淘宝网，天天上。”

        

”淘我喜欢！”

   

 不合理的地方： 1、 h1元素包含p元素，理由：h1元素内不能包含其他块级元素； 
2、 dt元素包含p元素和div元素，理由：dt元素内不能包含其他块级元素； 
3、 p元素包含div元素，理由：p元素内不能包含其他块级元素； 
4、 i元素，理由：i表样式斜体，不符合语义化。 
5、 b元素，理由：b表样式粗体，不符合语义化。 

第19题：

 请把以下用于连接字符串的JavaScript代码修改为更有效率的方式

  

var htmlString =

    "

";

   

 

var htmlString  =  "

";

第20题：

 请给Array本地对象增加一个原型方法，它用于删除数组条目中重复的条目(可能有多个)，返回值是一个包含被删除的重复条目的新数组。

 

Array.prototype.distinct = function() {

    var ret = [];

    for (var i = 0; i < this.length; i++)

    {

        for (var j = i+1; j < this.length;) {   

            if (this[i] === this[j]) {

                ret.push(this.splice(j, 1)[0]);

            } else {

                j++;

            }

        }

     }

     return ret;

}

//for test

alert(['a','b','c','d','b','a','e'].distinct());

第21题：

 请根据下面的描述，用JSON语法编写一个对象: “小明今年22岁，来自杭州。兴趣是看电影和旅游。他有两个姐姐，一个叫小芬，今年25岁，职业是护士。还有一个叫小芳，今年23岁，是一名小学老师。”
var person = ?

 

var person = {"name":"小明","age":"22","form":"杭州","interest":["电影","旅游"],"sister":

[{"name":"小芬","age":"25","job":"护士"},{"name":"小芳","age":"23","job":"小学老

师"}]};

第22题：

 请改善以下HTML代码，使其符合xHTML 1.0规范

 

    onClick='doSomething();'>  

      

   

 

    onclick='doSomething();'>