您需要先安装一个扩展,例如 篡改猴、Greasemonkey 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 Userscripts ,之后才能安装此脚本。
您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。
您需要先安装用户脚本管理器扩展后才能安装此脚本。
Greasy Fork is available in English.
我的仿jq库
当前为
此脚本不应直接安装。它是供其他脚本使用的外部库,要使用该库请加入元指令 // @require https://update.greasyfork.icu/scripts/11045/62714/TQuery.js
// ==UserScript== // @name TQuery // @author burningall // @description 我的仿jq库 // @version 2015.7.18 // @run-at document-start // @compatible chrome // @compatible firefox // @license The MIT License (MIT); http://opensource.org/licenses/MIT // @supportURL http://www.burningall.com // @contributionURL [email protected]|alipay.com // @namespace http://greasyfork.icu/zh-CN/users/3400-axetroy // ==/UserScript== (function(){//自调用,避免全局污染 function TQuery(tArg){ this.elements = [];//用来保存选择的元素 switch( typeof tArg ){ case "function" : addEvent(window,'load',tArg); break; case "string" : switch( tArg.charAt(0) ){ case "#" ://ID var obj = document.getElementById(tArg.substring(1));//去除# this.elements.push( obj );//保存元素 break; case "." ://class this.elements = getByClass(document,tArg.substring(1))//去除.,然后保存 break; default : //tagName this.elements = document.getElementsByTagName(tArg); } break; case "object" : //对象 this.elements.push(tArg); break; } } TQuery.prototype.eq = function(n){ return $(this.elements[n]);//作为对象存进this.elements,以便链式结构 } TQuery.prototype.find = function(str){ var aResult = [];//存放临时数据 for(var i=0;i<this.elements.length;i++){ switch( str.charAt(0) ){ case '.' : //.class var aElems= getByClass( this.elements[i],str.substring(1) ); aResult = aResult.concat(aElems); break; default : //tagName var aElems = this.elements[i].getElementsByTagName(str); appendArr(aResult,aElems); //aResult = aResult.concat(aElems);会出问题,数组不能与集合 } } var newObject = $(); newObject.elements = aResult; return newObject; } TQuery.prototype.length = function(n){ return this.elements.length; } TQuery.prototype.click = function(fn){ for(var i=0;i<this.elements.length;i++){ addEvent(this.elements[i],'click',fn); } return this;//返回对象,进行链式操作 } TQuery.prototype.index = function(){ return getIndex(this.elements[0]); } TQuery.prototype.style = function(attr){ return this.elements[0].currentStyle ? obj.currentStyle[attr] : getComputedStyle(this.elements[0])[attr]; } TQuery.prototype.size = function(attr){ return document.documentElement[attr] ? document.documentElement[attr] : document.body[attr] } TQuery.prototype.width = function(setting){ if(setting){ this.css('width',setting); return this;//返回对象,进行链式操作 } return parseInt( this.style('width')); } TQuery.prototype.height = function(setting){ if(setting){ this.css('height',setting); return this;//返回对象,进行链式操作 } return parseInt( this.style(this.elements[0],'height' )); } TQuery.prototype.scroll = function(dir,step,endFn) { //obj随意,dir>0往上滚,dir<0往下滚 var step = step || 10; clearInterval(document.timerScroll); document.timerScroll = setInterval(function() { var position; if (dir == 'up') { //往上滚动 var speed = ($(this).size('scrollTop') / step) + 1; position = $(this).size('scrollTop') - speed; if (position <= 0) { //如果滚到顶部 document.body.scrollTop = document.documentElement.scrollTop = 0; endFn && endFn(); clearInterval(document.timerScroll); } }else if(dir == 'down'){ //往下滚动 var speed = (($(this).size('scrollHeight') - $(this).size('scrollTop') - $(this).size('clientHeight')) / step) + 1; position = $(this).size('scrollTop') + speed; if (position + $(this).size('clientHeight') >= $(this).size('scrollHeight')) { //如果滚到底部 document.body.scrollTop = document.documentElement.scrollTop = $(this).size('scrollHeight'); endFn && endFn(); clearInterval(document.timerScroll); } } document.body.scrollTop = document.documentElement.scrollTop = position; }, 20) return this;//返回对象,进行链式操作 } TQuery.prototype.bind = function(e,fn){ for(var i=0;i<this.elements.length;i++){ addEvent(this.elements[i],e,fn); } return this;//返回对象,进行链式操作 } TQuery.prototype.show = function(){ for(var i=0;i<this.elements.length;i++){ this.elements[i].style.display = 'block'; } return this;//返回对象,进行链式操作 } TQuery.prototype.hide = function(){ for(var i=0;i<this.elements.length;i++){ this.elements[i].style.display = 'none'; } return this;//返回对象,进行链式操作 } TQuery.prototype.hover = function(over,out){ for(var i=0;i<this.elements.length;i++){ addEvent(this.elements[i],'mouseover',over); addEvent(this.elements[i],'mouseout',out); } return this;//返回对象,进行链式操作 } TQuery.prototype.css = function(attr,value){ if(arguments.length==2){//设置样式 for(var i=0;i<this.elements.length;i++){ this.elements[i].style[attr] = value; } }else{//一个参数 if(typeof attr=="string"){//获取样式 return this.elements[0].currentStyle ? this.elements[0].currentStyle[attr] : getComputedStyle(this.elements[0])[attr]; }else{//json for(var i =0;i<this.elements.length;i++){ for(var k in attr){ this.elements[i].style[k] = attr[k]; } } } } return this;//返回对象,进行链式操作 } TQuery.prototype.animate = function(json,fn){ startMove(this.elements[0], json, fn); function startMove(obj, json, endFn) { clearInterval(obj.timer); obj.timer = setInterval(function() { var bStop = true; for (attr in json) { // 1. 取得当前的值(可以是widht,height,opacity等的值) var objAttr = 0; if (attr == "opacity") { objAttr = Math.round(parseFloat($(obj).style(attr)) * 100); } else { objAttr = parseInt( $(obj).style(attr) ); } // 2.计算运动速度 var iSpeed = (json[attr] - objAttr) / 10; iSpeed = iSpeed > 0 ? Math.ceil(iSpeed) : Math.floor(iSpeed); // 3. 检测所有运动是否到达目标 if (objAttr != json[attr]) { bStop = false; } if (attr == "opacity") { obj.style.filter = 'alpha(opacity:' + (objAttr + iSpeed) + ')'; obj.style.opacity = (objAttr + iSpeed) / 100; } else { obj.style[attr] = objAttr + iSpeed + 'px'; // 需要又.属性名的形式改成[] } } if (bStop) { // 表示所有运动都到达目标值 clearInterval(obj.timer); endFn && endFn(); } }, 30); } return this;//返回对象,进行链式操作 } TQuery.prototype.drag = function(json){ for(var i=0;i<this.elements.length;i++){ new Drag( this.elements[i],this.elements[i],json ) } } TQuery.prototype.attr = function(attr,value){ if(arguments.length==2){//设置属性 for(var i=0;i<this.elements.length;i++){ this.elements[i][attr] = value; } }else{ return this.elements[0][attr]; } return this;//返回对象,进行链式操作 } TQuery.prototype.toggle = function(){ var _arguments = arguments; for(var i=0;i<this.elements.length;i++){ addToggle(this.elements[i]); } function addToggle(obj){ var count = 0; addEvent(obj,'click',function(){ _arguments[count++%_arguments.length].call(obj);//执行 }); } return this;//返回对象,进行链式操作 } TQuery.prototype.extend = function(name,fn){//库扩展,插件 TQuery.prototype[name] = fn; return this;//返回对象,进行链式操作 } //==输出 function $(tArg){ return new TQuery(tArg); } window.$ = $; //通用函数 function addEvent(obj, event, fn){ return obj.addEventListener ? obj.addEventListener(event, function(e){ if(fn.call(obj)==false ){ e.cancelBubble = true;//阻止冒泡 e.preventDefault();//chrome,firefox下阻止默认事件 } }, false) : obj.attachEvent('on' + event, function(){ //fn.call(obj);//解决IE8下,this是window的问题 if(fn.call(obj)==false ){ event.cancelBubble = true;//阻止冒泡 return false;//阻止默认事件,针对IE8 } }); } function getByClass(oParent,sClassName){ var aElement = oParent.getElementsByTagName('*');//获取所有子节点 var result = []; for(var i=0;i<aElement.length;i++){ if( aElement[i].className == sClassName ){ result.push(aElement[i]); } } return result; } function appendArr(arr1,arr2){//把arr2的集合/数组,push到arr1中 for(var i=0;i<arr2.length;i++){ arr1.push( arr2[i] ); } } function getIndex(obj){ var aBrother = obj.parentNode.children; for(var i=0;i<aBrother.length;i++){ if(aBrother[i] == obj){ return i; } } } //===============系统对象上添加============== //字符串倒序 String.prototype.reverse = function(){ return this.split('').reverse().join('') } Array.prototype.sum = function(){//给数组添加sum求和方法 var result = 0; for( var i=0;i<this.length;i++ ){ result += this[i]; } return result; } Array.prototype.unique = function(){//给数组添加去重方法 var a = {}; for (var i=0; i<this.length; i++) { var v = this[i]; if (typeof(a[v]) == 'undefined'){ a[v] = 1; } }; this.length=0; for (var i in a){ this[this.length] = i; } return this; } //===============自定义对象============== //面向对象选项卡 //使用方法 new TabSwitch('div1'); /* <div id="div1"> <input /> <input /> <input /> <div></div> <div></div> <div></div> </div> 结构: */ function TabSwitch(obj){ var _this = this; //var div1 = document.getElementById(id); var div1 = obj; this.aBtn = div1.getElementsByTagName('input'); this.aDiv = div1.getElementsByTagName('div'); for(var i=0;i<this.aBtn.length;i++){ this.aBtn[i].index=i; this.aBtn[i].onclick=function(){ _this.fnClick(this); } } }; TabSwitch.prototype.fnClick = function(oBtn){ for(var j=0;j<this.aBtn.length;j++){ this.aBtn[j].className=''; this.aDiv[j].style.display='none'; } oBtn.className='active'; this.aDiv[oBtn.index].style.display='block'; } //拖拽 //使用方法 new Drag($('press'),$('move'),{left:[100,200],top:[200,500]});(鼠标按住的目标,要移动的目标) /* var json = { left:[100,300], top:[200,500] } */ function Drag(pressTarget,MoveTarget,json){ var _this = this; this.disX = 0; this.disY = 0; if(json){ this.json = json; } this.MoveTarget = MoveTarget; pressTarget.onmousedown = function(e){ _this.fnDown(e); return false;//chrome,firefox去除文字选中 }; } Drag.prototype.fnDown = function(e){//鼠标按下(未松开) var e = e || window.event; var _this = this; this.disX = e.clientX - this.MoveTarget.offsetLeft; this.disY = e.clientY - this.MoveTarget.offsetTop; if(this.MoveTarget.setCaptrue){//IE,解决文字选中 this.MoveTarget.onmousemove = function(e){ _this.fnMove(e); }; this.MoveTarget.onmouseup = function(){ var this_ = this; _this.fnUp(this_); }; this.MoveTarget.setCaptrue();//添加事件捕获 }else{ document.onmousemove = function(e){ _this.fnMove(e); }; document.onmouseup = function(){ var this_ = this; _this.fnUp(this_); }; } } Drag.prototype.fnMove = function(e){//鼠标移动,则div移动 var e = e || window.event; var L = this.json ? this.range(e.clientX - this.disX,this.json.L[0],this.json.L[1]) : (e.clientX - this.disX); var T = this.json ? this.range(e.clientY - this.disY,this.json.T[0],this.json.T[1]) : (e.clientY - this.disY); this.MoveTarget.style.left = L + 'px'; this.MoveTarget.style.top = T + 'px'; } Drag.prototype.fnUp = function(this_){//鼠标松开,则停止 this_.onmousemove = null; this_.onmouseup = null; this_.setCaptrue && this_.releaseCapture();//释放捕获 } Drag.prototype.range = function(iNow,iMin,iMax){ if(iNow>iMax){ return iMax; }else if(iNow<iMin){ return iMin; }else{ return iNow; } } //拖拽改变大小 //使用方法 new scale($('press'),$('move'),{width:[100,200],height:[200,500]});(鼠标按住的目标,要移动的目标) /* var json = { width:[100,300], height:[200,500] } */ function Scale(pressTarget,MoveTarget,json){ if(json){ this.json = json; } this.MoveTarget = MoveTarget; var _this = this; pressTarget.onmousedown = function(e){ _this.onmousedownFn(e) }; } Scale.prototype.onmousedownFn = function(e){ var e = e || window.event; this.disX = e.clientX; this.disY = e.clientY; this.disW = this.MoveTarget.offsetWidth; this.disH = this.MoveTarget.offsetHeight; var _this = this; document.onmousemove = function(e){ _this.mouseoverFn(e) }; document.onmouseup = function(e){ _this.mouseupFn(e) }; } Scale.prototype.mouseoverFn = function(e){ var e = e || window.event; this.W = this.json ? this.range(e.clientX - this.disX + this.disW,this.json.width[0],this.json.width[1]) : (e.clientX - this.disX + this.disW); this.H = this.json ? this.range(e.clientY - this.disY + this.disH,this.json.height[0],this.json.height[1]) : (e.clientY - this.disY + this.disH); this.MoveTarget.style.width = this.W + 'px'; this.MoveTarget.style.height = this.H + 'px'; } Scale.prototype.mouseupFn = function(){ document.onmousemove = null; document.onmouseup = null; } Scale.prototype.range = function(iNow,iMin,iMax){ if(iNow>iMax){ return iMax; }else if(iNow<iMin){ return iMin; }else{ return iNow; } } })()