luxiaojian/index.html

## index.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
  <p id="adom">adom</p>
  <a href="#">link</a>
  <p class="name">name</p>
  <div data-log>data-src</div>
  <div data-time=2015>2015</div>
  <p id="adom" class="name">muti</p>

<script id="jsbin-javascript">
// 实现一个简单的Query
function $(selector) {
  var element;
  var arr = selector.split(" ");
  var idExp = /^#[\w-]+$/;
  var classExp = /^\.[\w\-]+$/;
  var attrExp = /^\[[\w\-=]+\]$/;

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

    //id选择器
    if(arr[i].search(idExp) != -1){
       var id= arr[i].slice(1);
      element = document.getElementById(id);
    }
    //元素选择器
    else if(arr[i].search(classExp) != -1){
      var classname= arr[i].slice(1);
      element = document.getElementsByClassName(classname)[0];
    }
    //属性选择器
    else if(arr[i].search(attrExp) != -1){
      var index = arr[i].indexOf("=");
      if(index != -1){
        var attr = arr[i].slice(1,index);
        var val = arr[i].slice(index+1,-1);
        element = getElementByAttribute(attr,val);
      }else{
        var attr = arr[i].slice(1);
        element = getElementByAttribute(attr,val);
      }
    }
    //元素选择器
    else{
      element =document.getElementsByTagName(arr[i])[0];
    }
  }
  return element;
}

//根据元素的属性名称和值来获取值
function getElementByAttribute(attr,val){
  var allElements = document.getElementsByTagName('*');
  if(val){
    for(var i=0;i<allElements.length;i++){
      if(allElements[i].getAttribute(attr) == val){
        return allElements[i];
      }
    }
  }else{
    for(var i=0;i<allElements.length;i++){
      if(allElements[i].getAttribute(attr)){
        return allElements[i];
      }
    }
  }
}

$("#adom").style.color="red";
$("a").style.color="red";
$(".name").style.color="red";
$("[data-time=2015]").style.color="red";
$("[data-log]").style.color="red";
</script>


<script id="jsbin-source-javascript" type="text/javascript">// 实现一个简单的Query
function $(selector) {
  var element;
  var arr = selector.split(" ");
  var idExp = /^#[\w-]+$/;
  var classExp = /^\.[\w\-]+$/;
  var attrExp = /^\[[\w\-=]+\]$/;

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

    //id选择器
    if(arr[i].search(idExp) != -1){
       var id= arr[i].slice(1);
      element = document.getElementById(id);
    }
    //元素选择器
    else if(arr[i].search(classExp) != -1){
      var classname= arr[i].slice(1);
      element = document.getElementsByClassName(classname)[0];
    }
    //属性选择器
    else if(arr[i].search(attrExp) != -1){
      var index = arr[i].indexOf("=");
      if(index != -1){
        var attr = arr[i].slice(1,index);
        var val = arr[i].slice(index+1,-1);
        element = getElementByAttribute(attr,val);
      }else{
        var attr = arr[i].slice(1);
        element = getElementByAttribute(attr,val);
      }
    }
    //元素选择器
    else{
      element =document.getElementsByTagName(arr[i])[0];
    }
  }
  return element;
}

//根据元素的属性名称和值来获取值
function getElementByAttribute(attr,val){
  var allElements = document.getElementsByTagName('*');
  if(val){
    for(var i=0;i<allElements.length;i++){
      if(allElements[i].getAttribute(attr) == val){
        return allElements[i];
      }
    }
  }else{
    for(var i=0;i<allElements.length;i++){
      if(allElements[i].getAttribute(attr)){
        return allElements[i];
      }
    }
  }
}

$("#adom").style.color="red";
$("a").style.color="red";
$(".name").style.color="red";
$("[data-time=2015]").style.color="red";
$("[data-log]").style.color="red";</script></body>
</html>

## jsbin.wehumu.js
// 实现一个简单的Query
function $(selector) {
  var element;
  var arr = selector.split(" ");
  var idExp = /^#[\w-]+$/;
  var classExp = /^\.[\w\-]+$/;
  var attrExp = /^\[[\w\-=]+\]$/;

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

    //id选择器
    if(arr[i].search(idExp) != -1){
       var id= arr[i].slice(1);
      element = document.getElementById(id);
    }
    //元素选择器
    else if(arr[i].search(classExp) != -1){
      var classname= arr[i].slice(1);
      element = document.getElementsByClassName(classname)[0];
    }
    //属性选择器
    else if(arr[i].search(attrExp) != -1){
      var index = arr[i].indexOf("=");
      if(index != -1){
        var attr = arr[i].slice(1,index);
        var val = arr[i].slice(index+1,-1);
        element = getElementByAttribute(attr,val);
      }else{
        var attr = arr[i].slice(1);
        element = getElementByAttribute(attr,val);
      }
    }
    //元素选择器
    else{
      element =document.getElementsByTagName(arr[i])[0];
    }
  }
  return element;
}

//根据元素的属性名称和值来获取值
function getElementByAttribute(attr,val){
  var allElements = document.getElementsByTagName('*');
  if(val){
    for(var i=0;i<allElements.length;i++){
      if(allElements[i].getAttribute(attr) == val){
        return allElements[i];
      }
    }
  }else{
    for(var i=0;i<allElements.length;i++){
      if(allElements[i].getAttribute(attr)){
        return allElements[i];
      }
    }
  }
}

$("#adom").style.color="red";
$("a").style.color="red";
$(".name").style.color="red";
$("[data-time=2015]").style.color="red";
$("[data-log]").style.color="red";
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>JS Bin</title>
	</head>
	<body>
	<p id="adom">adom</p>
	<a href="#">link</a>
	<p class="name">name</p>
	<div data-log>data-src</div>
	<div data-time=2015>2015</div>
	<p id="adom" class="name">muti</p>

	<script id="jsbin-javascript">
	// 实现一个简单的Query
	function $(selector) {
	var element;
	var arr = selector.split(" ");
	var idExp = /^#[\w-]+$/;
	var classExp = /^\.[\w\-]+$/;
	var attrExp = /^\[[\w\-=]+\]$/;

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

	//id选择器
	if(arr[i].search(idExp) != -1){
	var id= arr[i].slice(1);
	element = document.getElementById(id);
	}
	//元素选择器
	else if(arr[i].search(classExp) != -1){
	var classname= arr[i].slice(1);
	element = document.getElementsByClassName(classname)[0];
	}
	//属性选择器
	else if(arr[i].search(attrExp) != -1){
	var index = arr[i].indexOf("=");
	if(index != -1){
	var attr = arr[i].slice(1,index);
	var val = arr[i].slice(index+1,-1);
	element = getElementByAttribute(attr,val);
	}else{
	var attr = arr[i].slice(1);
	element = getElementByAttribute(attr,val);
	}
	}
	//元素选择器
	else{
	element =document.getElementsByTagName(arr[i])[0];
	}
	}
	return element;
	}

	//根据元素的属性名称和值来获取值
	function getElementByAttribute(attr,val){
	var allElements = document.getElementsByTagName('*');
	if(val){
	for(var i=0;i<allElements.length;i++){
	if(allElements[i].getAttribute(attr) == val){
	return allElements[i];
	}
	}
	}else{
	for(var i=0;i<allElements.length;i++){
	if(allElements[i].getAttribute(attr)){
	return allElements[i];
	}
	}
	}
	}

	$("#adom").style.color="red";
	$("a").style.color="red";
	$(".name").style.color="red";
	$("[data-time=2015]").style.color="red";
	$("[data-log]").style.color="red";
	</script>



	<script id="jsbin-source-javascript" type="text/javascript">// 实现一个简单的Query
	function $(selector) {
	var element;
	var arr = selector.split(" ");
	var idExp = /^#[\w-]+$/;
	var classExp = /^\.[\w\-]+$/;
	var attrExp = /^\[[\w\-=]+\]$/;

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

	//id选择器
	if(arr[i].search(idExp) != -1){
	var id= arr[i].slice(1);
	element = document.getElementById(id);
	}
	//元素选择器
	else if(arr[i].search(classExp) != -1){
	var classname= arr[i].slice(1);
	element = document.getElementsByClassName(classname)[0];
	}
	//属性选择器
	else if(arr[i].search(attrExp) != -1){
	var index = arr[i].indexOf("=");
	if(index != -1){
	var attr = arr[i].slice(1,index);
	var val = arr[i].slice(index+1,-1);
	element = getElementByAttribute(attr,val);
	}else{
	var attr = arr[i].slice(1);
	element = getElementByAttribute(attr,val);
	}
	}
	//元素选择器
	else{
	element =document.getElementsByTagName(arr[i])[0];
	}
	}
	return element;
	}

	//根据元素的属性名称和值来获取值
	function getElementByAttribute(attr,val){
	var allElements = document.getElementsByTagName('*');
	if(val){
	for(var i=0;i<allElements.length;i++){
	if(allElements[i].getAttribute(attr) == val){
	return allElements[i];
	}
	}
	}else{
	for(var i=0;i<allElements.length;i++){
	if(allElements[i].getAttribute(attr)){
	return allElements[i];
	}
	}
	}
	}

	$("#adom").style.color="red";
	$("a").style.color="red";
	$(".name").style.color="red";
	$("[data-time=2015]").style.color="red";
	$("[data-log]").style.color="red";</script></body>
	</html>