首页 > 网站 > WEB开发 > 正文

基于js的jquery开发本质

2024-04-27 15:06:35
字体:
来源:转载
供稿:网友
var $dn = dnQuery = (function(root){	var _PRoxy = function(selector){		return root.document.querySelectorAll(selector);	}	var $ = function(selector,parent){		return _proxy(selector);	};	$.extend = function(target){		for (var i = 1; i < arguments.length; i++) {			for(var prop in arguments[i]){				target[prop] = arguments[i][prop];			}		}		return target;	}	var __PROTO__ = {		each : function(callback){			for (var i = 0; i < this.length; i++) {				callback&&callback.call(this[i],i,this[i]);			}		},		get : function(index){			return this[index];		},		find : function(selector){			return $(selector);		},		html : function(html){			this.each(function(index,object){				object.innerHTML = html;			});			return this;		},		addClass : function(clazz){			this.each(function(index,object){				object.className = clazz;			});			return this;		},		removeClass : function(){			this.each(function(index,object){				object.className = "";			});			return this;		}	};	//[native code] prototype 是 const	$.fn = $.extend(NodeList.prototype,__PROTO__);	//创建了一个闭包空间	return $;}(window));
<!DOCTYPE html><html lang="en"><head>	<meta charset="UTF-8">	<title>Document</title>	<style type="text/CSS">		.class1{			font-size:22px;		}		.class2{			font-family: Arial,"Microsoft Yahei";		}	</style></head><body>	<div class="myTest">this is div1		<p></p>	</div>	<div class="myTest">this is div2</div>	<script src="assets/plug-in/dnJquery/dn-jquery.1.0.0.js"></script>	<script>		//var $test = $dn(".myTest");		// $dn.fn.find = function(){		// 	console.log("this is find");		// }		// console.log($test.length);		// console.log($test[0]);		// console.log($test.get(1));		// $test.addClass().removeClass().find();		//$test.addClass("class1 class2").find("p").html("<a href='#'>新增的超链接</a>");				//var $body = $(document.body);		console.log($.fn);	</script></body></html>
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表