<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Document</title>
<style>
div{
width:100px;
height:100px;
margin:10px;
background-color: pink;
}
</style>
<script>
window.οnlοad=function()
{
function $(str)
{
var s = str.charAt(0);//存储符号 .根据位置返回符号,charAt(),根据符号返回位置是indexOf()
var ss = str.substr(1);//从第一个位置取到最好 demo
switch (s)
{
case".":
return document.getElementsByClassName(ss);
break;
case"#":
return document.getElementById(ss);
break;
default:
return document.getElementsByTagName(str);
}
}
// $("#lalala").style.backgroundColor="blue";
// for(var i=0;i<$(".demo").length;i++) //有两个.demo,可以用数组遍历的方式让它们都变成绿色。
// {
// $(".demo")[i].style.backgroundColor="green";
// }
var text=$("div");
for(var j=0;j<text.length;j++)
{
$("div")[j].style.backgroundColor="gray";
}
}
</script>
</head>
<body>
<div class="demo"></div>
<div class="text"></div>
<div class="one"></div>
<div id="xxx"></div>
<div id="txtx"></div>
<div></div>
<div id="lalala"></div>
<div></div>
<div class="demo"></div>
<div id="hhh"></div>
</body>
</html>