<html>

<head>

</head>

<body>

<div id="div1">div1</div>

<div class=".div2">aaaa</div>

<div class=".div2">aaaa</div>

<p>p1</p>

<p>p2</p>

<script>

var TQObject = function(){

	this.data=[];

}

TQObject.prototype = {}

var $=function(selecter)

{

	this.tqOjbect = new TQObject();

	if (selecter.substring(0,1) == "#") {

		var elem = document.getElementById(selecter.substring(1));

		this.tqOjbect.data.push(elem);

	} else if (selecter.substring(0,1) == ".") {

		var elems = document.getElementsByTagName("*");

		console.log(elems);

		var reg  = new RegExp("(^|\\s)" + selecter.substring(1) + "($|\\s)");

		console.log(reg);

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

			if (reg.test(elems[i].className.substring(1))) {

				this.tqOjbect.data.push(elems[i]);

			}

		}

	} else {

		var elems = document.getElementsByTagName(selecter);

		this.tqOjbect.data.push(elems);

	}

	return tqOjbect;

}

window.onload=function(){

	var ele1 = $("#div1");

	var ele2 = $(".div2");

	var ele3 = $("p");

	console.log(ele2);

}

</script>

</body>

</html>

　　

模拟jquery的$()选择器的实现的更多相关文章

  1. 模拟jquery封装选择器

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. 原生JS模拟jQuery $

    模拟jQuery的$选择器 在获取元素的时候使用ID选择器,返回的是一个对象:使用类选择器或者标签选择器返回可能是一组元素:将获取到的一个或一组元素进行一个简易的封装封装成一个TQObject 什么是 ...

  3. js框架封装，模拟jQuery封装

    模拟jQuery框架,利用原生的js技术,封装一个js框架,以加深对jQuery的常用api的使用和面向对象原理的理解:一:结构部分首先利用闭包,构造一个自执行函数,然后利用选择器函数Sizzle,获 ...

  4. jQuery 的选择器常用的元素查找方法

    jQuery 的选择器常用的元素查找方法 基本选择器: $("#myELement")    选择id值等于myElement的元素,id值不能重复在文档中只能有一个id值是myE ...

  5. HTML 学习笔记 JQuery（选择器）

    学习前端也有一段时间了,今天终于进入到JQuery阶段了,对于新手来讲,JQuery的选择器类型之多 功能之强大实在不是一天两天能够记得完的.现在,就采用边学边记录的方式.以后要是忘了的话,也有一个地 ...

  6. 模拟jQuery简单封装ajax

    /*模拟jQuery的写法 (简单写法)*/ var $={}; /*ajax*/ $.ajax = function (options) { /* * 请求 * 1.请求接口 type get po ...

  7. 模拟jQuery库

    用js模拟jQuery方法,体会封装思想 <!DOCTYPE html><html><head><meta charset="UTF-8" ...

  8. jQuery的选择器中的通配符总结

    1.选择器 (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='code']&quo ...

  9. ajx技术解析以及模拟jQuery封装

    1.后台处理程序 <%@ page language="java" contentType="text/html; charset=UTF-8" page ...

随机推荐

  1. centos6.3安装python2.7, pip2.7, mysql

    参考: https://github.com/h2oai/h2o-2/wiki/Installing-python-2.7-on-centos-6.3.-Follow-this-sequence-ex ...

  2. sys/types.h fcntl.h unistd.h sys/stat.h

    sys/types.h 是Unix/Linux系统的基本系统数据类型的头文件,含有size_t,time_t,pid_t等类型. 在应用程序源文件中包含 <sys/types.h> 以访问 ...

  3. 【XLL 框架库函数】 QuitFramework

    去初使化框架库,简问题是才的重新初使化 XLOPER/XLOPER12. 参数 这个函数没有参数 属性值/返回值 这个函数没有返回值.

  4. LATTICE 存储之FIFO的使用

    坑,,以后填 对于Lattice 的  FIFO 存储器分为两种,见下图: 这两个的主要区别是一个后面加DC一个不加,那这个DC是什么意思呢??DC这里是Dual  Clock的意思,也就是双时钟的意 ...

  5. 【Jsoup网页解析】

    下载链接:http://jsoup.org/download 一.普通的请求方式(不带有cookie) 使用举例: 第一步: Connection conn=Jsoup.connect(url); 第 ...

  6. Java中分割字符串

    java.lang.String 的 split() 方法, JDK 1.4 or later public String[] split(String regex,int limit) 示例代码 p ...

  7. 【leetcode】Unique Binary Search Trees (#96)

    Given n, how many structurally unique BST's (binary search trees) that store values 1...n? For examp ...

  8. 使用SQL Server Analysis Services数据挖掘的关联规则实现商品推荐功能（七）

    假如你有一个购物类的网站,那么你如何给你的客户来推荐产品呢?这个功能在很多电商类网站都有,那么,通过SQL Server Analysis Services的数据挖掘功能,你也可以轻松的来构建类似的功 ...

  9. [译]SQL Server分析服务的权限配置

    简介: 本文介绍如何配置SSAS数据库和cube相关维度的安全设置. 相对数据引擎来说,在Management Studio中配置分析服务的安全设置基本没什么区别.但是也会有一些限制,比如SSAS的权 ...

  10. PullToRefreshListView相关

    PullToRefresh使用详解(四)--利用回调函数实现到底加载   链接