javascript基础题目

1、实现mask:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!-- lang: html -->
<html lang="ru">
<!-- lang: html -->
<head>
<!-- lang: html -->
  <title></title>
<!-- lang: html -->
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<!-- lang: html -->
</head>
<!-- lang: html -->
<body>
<!-- lang: html -->

<!-- lang: html -->
<div style="width:960px;margin:0 auto;" >
<!-- lang: html -->
  <div id='box'  style="position:relative;">
<!-- lang: html -->

<!-- lang: html -->
  <img src="http://gi4.md.alicdn.com/bao/uploaded/i4/TB1AnXXFVXXXXaDXVXXXXXXXXXX_!!0-item_pic.jpg_430x430q90.jpg"/> </div>
<!-- lang: html -->

<!-- lang: html -->
</div>
<!-- lang: html -->

<!-- lang: html -->

<!-- lang: html -->
<script type="text/javascript">
<!-- lang: html -->

<!-- lang: html -->
function  mask(id){
<!-- lang: html -->

<!-- lang: html -->
var m=  document.createElement('DIV');
<!-- lang: html -->
m.style.cssText="opacity: 0.5;position:absolute;width:500px;height:430px;border:1px solid red;top:0;left:0;background:#000"
<!-- lang: html -->
m.innerHTML="xxx";
<!-- lang: html -->
document.getElementById(id).appendChild(m);   
<!-- lang: html -->

<!-- lang: html -->

<!-- lang: html -->
}
<!-- lang: html -->

<!-- lang: html -->

<!-- lang: html -->
</script>
<!-- lang: html -->

<!-- lang: html -->
<button onclick="mask('box')"> mask </button>
<!-- lang: html -->
</body>
<!-- lang: html -->
</html>

虽然都是很基础的语法,但是应用的还是很巧妙的。

2、实现map:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!-- lang: html -->
<html>
<!-- lang: html -->
<head>
<!-- lang: html -->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- lang: html -->
<title>Insert title here</title>
<!-- lang: html -->

<!-- lang: html -->
</head>
<!-- lang: html -->
<body>
<!-- lang: html -->
<script type="text/javascript">
<!-- lang: html -->
function getParam(url){
<!-- lang: html -->
    var pos=url.indexOf('?');
<!-- lang: html -->

<!-- lang: html -->

<!-- lang: html -->
    var qs=url.substring(pos+1);
<!-- lang: html -->

<!-- lang: html -->

<!-- lang: html -->
    var pair=qs.split("&");
<!-- lang: html -->

<!-- lang: html -->
    var params={};
<!-- lang: html -->
    for(var i=0;i<pair.length;i++){
<!-- lang: html -->

<!-- lang: html -->
        var fields=pair[i].split('=');
<!-- lang: html -->

<!-- lang: html -->
        params[fields[0]]=fields[1];
<!-- lang: html -->

<!-- lang: html -->

<!-- lang: html -->
    }
<!-- lang: html -->

<!-- lang: html -->
    return params;
<!-- lang: html -->
}
<!-- lang: html -->

<!-- lang: html -->
    var test = new getParam("http:\//item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e");
<!-- lang: html -->
</script>
<!-- lang: html -->
</body>
<!-- lang: html -->
</html>

你可能感兴趣的:(javascript基础题目)