经典的阿里前端笔试题

function doSomething() {  
  alert(this);  
}   

<div id="page">
    <div class="main"><div class="sub"></div></div>
    <div class="nav"></div>
</div>
<style type="text/css">
    #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; }
</style> 

 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);
            });
        };
    }

    function toRGB(val) {
        var reg1 = /^#([0-9A-F]{2})([0-9A-F]{2})([0-9A-F]{2})$/i,
             reg2 = /^#([0-9A-F])([0-9A-F])([0-9A-F])$/i,
            reg3 = /[0-9A-F]{2}/g,
             m;
        if(reg2.test(val)) {
            val = val.replace(reg2, "#$1$1$2$2$3$3");
        }
        if(reg1.test(val)) {
            m  = val.match(reg3);
            val = "rgb(" + [
                     parseInt(m[0], 16),
                     parseInt(m[1], 16),
                      parseInt(m[2], 16)
                  ].join(", ") + ")";
        }
        return val;
}

this.msg = msg;
this.shout = function(){
alert(this.msg);
}
this.waitAndShout = function(){
//隔五秒钟后执行上面的shout方法
}
}

this.waitAndShout = function(){
//隔五秒钟后执行上面的shout方法
var _self = this;
setTimeout(function(){
_self.shout();
},5000);
}

var checkEmail  = function(email){
var preg = 
 "(^[a-zA-Z]|^[\\w-_\\.]*[a-zA-Z0-9])@(\\w+\\.)+\\w+$"，,
pregObj  =new RegExp(preg);
return pregObj.test(email);
}

<div class="item">
    <div class="item-pic">
        <a href="path/to/item">
            <img src="path/to/img" alt="商品图片" />
        </a>
    </div>
    <div class="item-desc">
        <a href="path/to/item/">联想IdeaPad U130红色至尊 高性价比</a>
    </div>
    <div class="item-price">
        <em>￥8888.00</em>
    </div>
</div>

var oDiv = document.createElement(“div”);
oDiv.setAttribute(“id”, ”example”);
oDiv.className = “box”;
var oP = document.createElement(“p”);
oDiv.appendChild(oP); 
var oText = document.createTextNode(“淘宝前端笔试题”)
oP.appendChild(oText);
document.body.appendChild(oDiv);

if(isIE) {//
oDiv.setAttribute(“className”, ” box”);
} else {
oDiv.setAttribute(“class”, ” box”);
}

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;
}

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;
}
}

<style type="text/css">
    .tip { color: gray; }
</style>
<input type="text" id="test" class="tip" value="请输入内容" />
<script type="text/javascript">
(function(){
    var test = document.getElementById("test"),
        REG = /(^|\s+)tip(\s+|$)/,
        TIP_CLS = "tip",
        TIP_STR = "请输入内容";
    test.addEventListener("focus", function() {
        var className = this.className;
        if(className.match(REG)) {
            this.value = "";
            this.className = className.replace(TIP_CLS, "");
        }
    }, false);
    test.addEventListener("blur", function() {
        if(this.value.length == 0) {
            this.value = TIP_STR;
            this.className += " " + TIP_CLS;
        }
   }, false);
})();
</script>

function parseQueryString ( name ){
  name = name.replace(/[\[]/,"\\\[");
  var regexS = "[\\?&]"+name+"=([^&#]*)";
  var regex = new RegExp( regexS );
  var results = regex.exec( window.location.href );
  if( results == null )
    return "";
  else
    return results[1];
}

<h1><p>小明的表白</p></h1>
<dl>
<dt><p><div>小明说：</div></p></dt>
<dd>”淘宝网，<i>天天上</i>。”</dd>
<dd><b>”淘我喜欢！” </b></dd>
</dl>

<h1><span>小明的表白</span></h1>
<dl>
<dt><span>小明说：</span></dt>
<dd>”淘宝网，<em>天天上</em>。”</dd>
<dd><strong>”淘我喜欢！”</strong></dd>
</dl>

var htmlString = ‘<div class=”container”>’  +  
‘<ul id=”news-list”>’;
for (var i = 0; i < NEWS.length; i++) {
htmlString += ‘<li><a href=”’ + 
NEWS[i].LINK + ‘”> + 
NEWS[i].TITLE + ‘</a></li>’;
}
htmlString += ‘</ul></div>’;

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());

var person = {
"name": "小明", "age": 22, 
"city": "杭州", 
"interest": ["电影", "旅游"],
"sisters": [
{"name": "小芬", "age": 25, "job": "护士"}, 
{"name": "小芳", "age": 23, "job": "小学老师"}
]
};

<A id=‘go-home‘ href=‘http://www.taobao.com‘ 
onClick=‘doSomething();‘>
<IMG src="http://www.taobao.com/logo.png">
</A>

<a id=’go-home’ href=’http://www.taobao.com’ 
onclick=’doSomething();’>
<img src=’http://www.taobao.com/logo.png’ />
</a>