<!DOCTYPE html>

<html>
<head>
    <title></title>
    <style type="text/css">
    * { padding:0; margin:0;}
    li { list-style:none; width:200px; height:200px; float:left; text-align:center; line-height:200px; color:White; font-size:80px; }
     
    </style>
    <script language="javascript" type="text/javascript">
 
 
        /*这里是库*/
        (function (window, undefined) {
 
            window.$ = function (id) {
                return new Init(id);
            }
            function Init(id) {
                if (typeof id == "string") {
                    this[0] = document.getElementById(id);
                }
                else if (typeof id == "object") {
                    this[0] = id;
                }
            }
 
            Init.prototype.on = function (attr, fn, select) {
                this[0]["on" + attr] = function (ev) {
                    var oEvent = ev || event;
                    var _this = oEvent.srcElement || oEvent.target;
                    if (_this.tagName.toUpperCase() === select.toUpperCase()) {
                        if (fn) fn.call(_this, oEvent);
                    }
 
                }
                return this; //不断返回new出来的那个对象 实现Jquery的连缀 $("").on(function(){}).on(funciton(){})......
            }
            Init.prototype.css = function (json) {
                for (var i in json) {
                    this[0].style[i] = json[i];
                }
                return this; //不断返回new出来的那个对象 实现Jquery的连缀 $("").on(function(){}).on(funciton(){})......
            }
 
 
        })(window);
        /*这里是库*/
 
 
        window.onload = function () {
            $("ul1").on("click", function () {
                $(this).css({ background: "green", height: "400px" }).css({ fontSize: "100px" }).on("mouseover", function () {
                    $(this).css({ height: "200px" });
                }, "li");
            }, "li");
 
        }
 
    </script>
</head>
<body>
<ul id="ul1">
<li>0</li>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
</body>
</html>
 
 

仿JQ插件的更多相关文章

  1. JQ插件之imgAreaSelect实现对图片的在线截图功能（java版）

    前言:在做网站的时候经常用的功能就是,用户上传图片对自己上传的图片进行截图,DIV自己的头像.或者上传幻灯片大图进行DIV设置小图. 解决方案:目前我知道的解决方案有两个如下:       一.fla ...

  2. jq插件处女座 图片轮播

    好久没写博客了,变得好懒呀,无地自容.最近一直在学sass和jq插件的写法,照猫画虎的谢了一个jq的插件,也算是第一次真正称得上插件的插件 ,废话不多说 上代码 (function($) { $.fn ...

  3. jq插件第二款来袭 图片滚动

    这第二款也是非常实用的插件,也是与图片相关,关于图片的需求太多了,这个是图片滚动哦,不过不是无缝滚动,是左像右滚动,到头的话再往回滚动,利用scrollLeft实现的,支持自动滚动和每次滚动的个数默认 ...

  4. 个人学习JQ插件编写成果：little酷炫的图片滑动切换效果

    工作一个多月了,好久没来冒冒泡了,看了@wayong的JQ插件教程,自己编写了一个模仿拉勾网首页广告栏滑动特效的JQ插件,现在跟朋友们分享分享! 先上demo链接:http://runjs.cn/de ...

  5. 一个简单而实用的JQ插件——lazyload.js图片延迟加载插件

      前  言 Cherish 看多了炫酷的插件之后再来看这么一个小清新的东西,是不是突然感觉JQ插件感觉很友好了,简单强大最重要的是实用. 这篇文章将详细讲解一下lazyload.js的用法 lazy ...

  6. 写一个简单的JQ插件(例子)

    虽然现在 vue angular react 当道啊但是那 JQ还是有一席之地很多很多的小单位啊.其实还会用到 我也放一个例子吧虽然我也不是很肯定有没有人写的比我更好啊但是我相信 我这个还是蛮实用的 ...

  7. 创建jq插件步骤

    无意看了这篇<jQuery插件开发精品教程,让你的jQuery提升一个台阶>文章,现在做一下总结. 一.jQuery插件的创建可以有三种方法 1.通过$.extend()来扩展jQuery ...

  8. jq插件和jq

    封装一个jq (function(win) { var jQuery = function(selecter) { this.version = '1.0.1'; //版本号 this.selecte ...

  9. 单元测试地二蛋 先弄个两个原生模块1个原始的一个jq插件

    放羊测试测完了再测这两个瞎搞的下拉列表组建 看看从单元测试模块化的角度组建会写成啥样 1:ajax请求 简单文本     2:1个页面多个实例     3:复杂展示+自定义点击+自定义处理函数     ...

随机推荐

  1. 文章13称号 Add Two Numbers

    You are given two linked lists representing two non-negative numbers. The digits are stored in rever ...

  2. 概率统计（DP）

    问题叙述性说明 生成n个月∈[a,b]随机整数.并且将它们输出到x概率. 输入格式 输入线跟四个整数n.a,b,x,用空格分隔. 输出格式 输出一行包括一个小数位和为x的概率.小数点后保留四位小数 例 ...

  3. Code Forces 448C Painting Fence 贪婪的递归

    略有上升称号,最近有很多问题,弥补啊,各类竞赛滥用,来不及做出了所有的冠军.这个话题 这是一个长期记忆的主题.这是不是太困难,基本技能更灵活的测试,每次我们来看看这个问题可以被删除,处理然后分段层,贪 ...

  4. Visual Studio 2015使用EF6的CodeFirstFromDB模式操作Sqlite数据库时Provider问题

    传送门 什么是CodeFristFromDB 问题:查询数据是遇到 “/”应用程序中的服务器错误. No Entity Framework provider found for the ADO.NET ...

  5. 一起写2048(160行python代码)

    前言: Life is short ,you need python. --Bruce Eckel 我与2048的缘,不是缘于一个玩家.而是一次,一次,重新的ACM比赛.四月份校赛初赛,第一次碰到20 ...

  6. WPF学习（8）数据绑定

    说到数据绑定,其实这并不是一个新的玩意儿.了解asp.net的朋友都知道,在asp.net中已经用到了这个概念,例如Repeater等的数据绑定.那么,在WPF中的数据绑定相比较传统的asp.net中 ...

  7. 小丁带你走进git的世界三-撤销修改（转）

    一.撤销指令 git checkout还原工作区的功能 git reset  还原暂存区的功能 git clean  还没有被添加进暂存区的文件也就是git还没有跟踪的文件可以使用这个命令清除他们 g ...

  8. BZOJ 3362 POJ 1984 Navigation Nightmare 并与正确集中检查

    标题效果:一些养殖场是由一些南北或东西向的道路互连. 镶上在不断的过程中会问两个农场是什么曼哈顿的距离,假设现在是不是通信.那么输出-1. 思维:并与正确集中检查,f[i]点i至father[i]距离 ...

  9. NSIS：禁止多次安装实例

    原文 NSIS:禁止多次安装实例 为了防止用户重复安装软件,我们可以加入以下的判断来进行限制. 第一步:在安装脚本中,将是否已安装的标记Installed写入注册表中: 1 Section -Post ...

  10. 续x奇数倍(n+2*x)暴力算法是冠军的算法结合数量

    // 续6单a,a+2,a+4,a+6,a+8,a+10是共同的数.最低要求a // 暴力解决方案 首先对结果,后面将代码粘贴: 1次连续n=9,连续值个数: 1;耗时: 0ms,总计: 0ms 2次 ...