// 实现一个简单的Query
function $(selector) {
var firstChar = selector.charAt();
if (firstChar == "#") {
var len = selector.split(" "); if (len.length == ) {
return document.getElementById(selector.slice(,selector.length));
}
else {
var resu = [];
var getId = document.getElementById(len[].slice(,len[].length));
for (var i = ; i < getId.children.length; i++) {
if(getId.children[i].className == len[].slice(,len[].length)) {
resu.push(getId.children[i]);
};
}
return resu[];
}
}
else if (firstChar == ".") {
return document.getElementsByClassName(selector.slice(,selector.length))[];
}
else if (firstChar == "[") {
if (selector.match(/=/)) {
var index = selector.indexOf("=");
var cao1 = selector.slice(,index);
var cao2 = selector.slice(index+,selector.length-);
var all = document.getElementsByTagName('*');
var res1 = [];
for (var i = ; i < all.length; i++) {
if(all[i].getAttribute(cao1)&&all[i].getAttribute(cao1) == cao2) {
res1.push(all[i]);
}
}
return res1[];
}
else {
var cao = selector.slice(,selector.length-);
var all = document.getElementsByTagName('*');
var res = [];
for (var i = ; i < all.length; i++) {
if(all[i].getAttribute(cao)) {
res.push(all[i]);
}
}
return res[];
}
}
else {
return document.getElementsByTagName(selector)[];
}
} // 给一个element绑定一个针对event事件的响应,响应函数为listener
function addEvent(element, event, listener) {
// your implement
element.addEventListener(event,listener,false);
} // 移除element对象对于event事件发生时执行listener的响应
function removeEvent(element, event, listener) {
// your implement
element.removeEventListener(event,listener,false);
} // 实现对click事件的绑定
function addClickEvent(element, listener) {
// your implement
addEvent(element,"click",listener);
} // 实现对于按Enter键时的事件绑定
function addEnterEvent(element, listener) {
// your implement
element.onkeyDown = function(event) {
var e = event || window.event;
if (e&&e.keyCode == ) {
listener();
}
}
} function delegateEvent(element, tag, eventName, listener) {
$.on(element,eventName,function(){
var e = event ||window.event;
var target = e.target ||e.srcElement;
if (target.tagName == tag) {
listener();
}
})
}

$.on = addEvent;
$.un = removeEvent;
$.click = addClickEvent;
$.enter = addEnterEvent;
$.delegate = delegateEvent;

 

百度前端技术学院2015JavaScript基础部分实现自己的小型jQuery的更多相关文章

  1. 百度前端技术学院2015JavaScript基础部分代码实现

    2. JavaScript数据类型及语言基础(一)    2.1 任务描述 创建一个JavaScript文件,比如util.js: 实践判断各种数据类型的方法,并在util.js中实现以下方法:  / ...

  2. 百度前端技术学院2015JavaScript基础部分-BOM

    5.1 任务描述 实现以下函数 // 判断是否为IE浏览器,返回-1或者版本号 function isIE() { // your implement } // 设置cookie function s ...

  3. 百度前端技术学院-基础-day1

    2020.9.14 今天我开始在百度前端技术学院学习基础课程. 先立一个Flag,希望我能在30天之内学完前四十天的课程,后续课程再一天一节. 第一天的内容主要是提供了很多基础学习的网页,比如W3sc ...

  4. 百度前端技术学院(IFE)2016春季学期总结

    今天(5月16日)作为第八个提交者提交了任务五十:RIA微型问卷管理平台 这样一个综合性的大任务,宣告我的IFE春季学期课程学习顺利完成.其实任务五十并不复杂,现在再让我来做,可能一周不到就写出来了, ...

  5. 百度前端技术学院—-小薇学院(HTML+CSS课程任务)

    任务一:零基础HTML编码 课程概述 作业提交截止时间:04-24 重要说明 百度前端技术学院的课程任务是由百度前端工程师专为对前端不同掌握程度的同学设计.我们尽力保证课程内容的质量以及学习难度的合理 ...

  6. 百度前端技术学院task1.10

    任务十:Flexbox 布局练习 面向人群: 有一定HTML及CSS基础的同学 难度: 中 重要说明 百度前端技术学院的课程任务是由百度前端工程师专为对前端不同掌握程度的同学设计.我们尽力保证课程内容 ...

  7. 通过Github Pages在线查看百度前端技术学院完成的任务成果

    前言 .note-content {font-family: "Helvetica Neue", Arial, "Hiragino Sans GB", STHe ...

  8. 百度前端技术学院-task1.3源代码

    因为其中有图片,所以就给有图片的位置加了边框和设置了大小,这样哪怕图片不显示也可以知道在哪里. <!DOCTYPE html> <html> <head> < ...

  9. 百度前端技术学院-基础-day2

    2020.9.15 今天是学习前端基础技术的第二天,今天制作了一个在线简历,纯html的那种.帮助我复习了以前的基础知识,也增加了新的知识点,比如制作列表可以用fieldset来整合数据. 我的在线简 ...

随机推荐

  1. 有关uploadifive的使用经验

    这段时间做了一个项目用到uploadifive上传控件,和uploadify不同,这个控件是基于HTML5的版本而不用支持falsh,因而移动端也可以使用. 整理用过的相关属性与方法: 属性 作用 a ...

  2. PHP 文件的操作

    操作文件的步骤: 1.打开文件2.做操作PS!!!3.关闭文件 打开 操作

  3. Lander-Waterman model

    参考: Lander-Waterman Model 这个模型是鸟枪法测序和基因组装的最基本的理论模型,它揭示了测序深度与覆盖度之间的关系. 该模型回答了一个最基本的问题:How many reads ...

  4. Windows 7 封装篇(一)【母盘定制】[手动制作]定制合适的系统母盘

    Windows 7 封装篇(一)[母盘定制][手动制作]定制合适的系统母盘 http://www.win10u.com/article/html/10.html Windows 7 封装篇(一)[母盘 ...

  5. linux centos yum安装LAMP环境

    centos 6.5 1.yum安装和源代码编译在使用的时候没啥区别,但是安装的过程就大相径庭了,yum只需要3个命令就可以完成,源代码需要13个包,还得加压编译,步骤很麻烦,而且当做有时候会出错,源 ...

  6. linux centos 安装mysql

    安装步骤 http://www.cnblogs.com/gaojupeng/p/5727069.html 下面这个报错 主要还是在 题啊加软连接的   命令出了问题 1.启动  报错 mysqld_s ...

  7. chrome经常崩溃解决过程

    之前chrome常崩溃,也没有找到原因,就将就着用吧,一直用到今天,今天连续几次崩了,突然想到,难道是因为我访问的域名没有解析(能想到这个,是因为今天分配公司域名测试的时候常输错),于是就输入一个不存 ...

  8. hdu1754 I Hate It

    题目链接:hdu1754 I Hate It 树状数组学习参考博客:http://blog.csdn.net/u010598215/article/details/48206959 树状数组之前没看懂 ...

  9. python【6】-函数式编程

    一.高阶函数 map,reduce 1.map() 函数接收两个参数,一个是函数,一个是序列,map将传入的函数依次作用到序列的每个元素,并把结果作为新的list返回. def f(x): retur ...

  10. onclick传递参数

    http://zhidao.baidu.com/link?url=rLnWM99L8L-fT-dZzw5SgIGI5rc2GmT2P4CQ3ir5Z0zdfZKdkraeURMT95r8POHMup7 ...