jq插件和jq
封装一个jq
(function(win) {
var jQuery = function(selecter) {
this.version = '1.0.1'; //版本号
this.selecter = selecter;
return this;
};
jQuery.prototype.getElement = function() {
// 当前只支持取id
// 如果是class或者tag,得装在数组里
this.elem = document.getElementById(this.selecter);
return this;
};
jQuery.prototype.html = function(val) {
var elem = this.elem;
if(val) {
elem.innerHTML = val;
return this;
} else {
return elem.innerHTML;
}
};
jQuery.prototype.on = function(type, Fn) {
var elem = this.elem;
elem.addEventListener(type, Fn);
return this;
};
jQuery.init = function(selecter) {
return new this(selecter);
};
win._jQuery = jQuery;
})(window);
function $(selecter) {
var test = _jQuery.init(selecter);
return test.getElement(selecter);
}
function jQuery(selecter) {
var test = _jQuery.init(selecter);
return test.getElement(selecter);
}
使用
<div id="one">hello world</div>
<div id="two">我是一个带有class属性的标签</div>
//来个点击事件
jQuery('one').html('hello girl').on('click', function() {
alert('hello boy');
});
//或者来个赋值操作
$('two').html('hello baby');
// 打印版本
console.log($().version);
封装一个jq插件
(function ($) {
$.fn.myPlugins = function (options) {
//参数赋值
options = $.extend(defaults, options);//对象合并
this.each(function () {
//执行代码逻辑
});
};
})(jQuery);
// 使用
$(selector).myPlugins({参数});
jq插件和jq的更多相关文章
- 单元测试地二蛋 先弄个两个原生模块1个原始的一个jq插件
放羊测试测完了再测这两个瞎搞的下拉列表组建 看看从单元测试模块化的角度组建会写成啥样 1:ajax请求 简单文本 2:1个页面多个实例 3:复杂展示+自定义点击+自定义处理函数 ...
- JQ插件之imgAreaSelect实现对图片的在线截图功能(java版)
前言:在做网站的时候经常用的功能就是,用户上传图片对自己上传的图片进行截图,DIV自己的头像.或者上传幻灯片大图进行DIV设置小图. 解决方案:目前我知道的解决方案有两个如下: 一.fla ...
- jq插件处女座 图片轮播
好久没写博客了,变得好懒呀,无地自容.最近一直在学sass和jq插件的写法,照猫画虎的谢了一个jq的插件,也算是第一次真正称得上插件的插件 ,废话不多说 上代码 (function($) { $.fn ...
- jq插件第二款来袭 图片滚动
这第二款也是非常实用的插件,也是与图片相关,关于图片的需求太多了,这个是图片滚动哦,不过不是无缝滚动,是左像右滚动,到头的话再往回滚动,利用scrollLeft实现的,支持自动滚动和每次滚动的个数默认 ...
- 个人学习JQ插件编写成果:little酷炫的图片滑动切换效果
工作一个多月了,好久没来冒冒泡了,看了@wayong的JQ插件教程,自己编写了一个模仿拉勾网首页广告栏滑动特效的JQ插件,现在跟朋友们分享分享! 先上demo链接:http://runjs.cn/de ...
- 一个简单而实用的JQ插件——lazyload.js图片延迟加载插件
前 言 Cherish 看多了炫酷的插件之后再来看这么一个小清新的东西,是不是突然感觉JQ插件感觉很友好了,简单强大最重要的是实用. 这篇文章将详细讲解一下lazyload.js的用法 lazy ...
- 写一个简单的JQ插件(例子)
虽然现在 vue angular react 当道啊但是那 JQ还是有一席之地很多很多的小单位啊.其实还会用到 我也放一个例子吧虽然我也不是很肯定有没有人写的比我更好啊但是我相信 我这个还是蛮实用的 ...
- 创建jq插件步骤
无意看了这篇<jQuery插件开发精品教程,让你的jQuery提升一个台阶>文章,现在做一下总结. 一.jQuery插件的创建可以有三种方法 1.通过$.extend()来扩展jQuery ...
- jq选择器(jq 与 js 互相转换),jq操作css样式 / 文本内容, jq操作类名,jq操作全局属性,jq获取盒子信息,jq获取位置信息
jq选择器(jq 与 js 互相转换) // 获取所有的页面元素jq对象 $('css3选择器语法'); var $box = $(".box:nth-child(1)"); 获取 ...
随机推荐
- FreeSWITCH 加载模块过程解读
今天来学习FreeSWITCH 加载模块过程. 哪些模块需要编译,是由源码下的 modules.conf 文件决定的. 哪些模块在程序启动时自动加载,是由 freeswitch/conf/autolo ...
- PAT A1131 Subway Map
dfs,选择最优路径并输出~ 这道题难度非常炸裂,要求完完整整自己推一遍,DFS才算过关!思路:一遍dfs,过程中要维护两个变量,minCnt 中途停靠最少的站.minTransfer需要换成的最少次 ...
- lua叠代器
注意:叠待值遇到nil就退出 叠代器,是符合for遍历框架,需要满足条件 1-叠代函数,常量,控制变量 2-叠代函数可以接受二个参数,当然也可以忽略处理(利用闭包封装参数作为控制变量和状态变量) 无状 ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 排版:标题
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- vue-cli 手脚架mock虚拟数据的运用,特别是坑!!!
1.现在基本的趋势就是前后分离,前后分离就意味着当后台接口还没完成之前,前端是没有接口可以拿来调用的 ,那么mock虚拟数据就很好的解决了这一问题,前端可以直接模拟真实的数据AJAX请求! 运用 步骤 ...
- mysql 命令行个性化设置
通过配置显示主机和用户名 mysql -u root -p --prompt="(\u@\h) [\d]>" 或在配置文件中修改,可在命令行中的目标位置查看 --tee na ...
- python人脸对比
import sys import ssl from urllib import request,parse # client_id 为官网获取的AK, client_secret 为官网获 ...
- idea配置使用
1.下载时注意连带下载git 2.实时清除内存 打开 show memory indicator 3.插件安装 前端常用插件(vue,element,css,html,node,ts等)找到适合自己 ...
- 虚拟机centos7 识别不出网卡的解决方案
问题提出 之前在VMware安装centos 7(网络连接采取Nat方式),进入Centos 7后成功开启了sshd服务,然后在主机(我的windows系统)用puTTY软件可以ssh到虚拟机上.后来 ...
- KVM虚拟化与容器的区别理解
1.KVM虚拟化是linux内核的虚拟化,提供了内核级别的虚拟进程管理,客户空间的程序QEMU-KVM可以提供资源清单和模拟设备,与KVM交互 QEMU-KVM--可以在宿主机器,建立网络(网桥交换机 ...