封装自己的jquery框架

jQuery is a fast small JavaScript library

如何封装自己的jQuery

<script>

// 这里使用沙箱模式,可以防止全局污染

(function(window,undefined){

var jQuery = function (ele){

return new jQuery.prototype.init(ele)

}

// 原型替换

jQuery.fn = jQuery.prototype ={

constructor:jQuery,

init:function(ele){

var ele = document.querySelectorAll(ele);

[].push.apply(this,ele);

},

// 这里用css()举例子

css:function(name,value){

if(arguments.length == 2){

//设置css样式

}else if(arguments.length == 1){

if( typeof name === ‘object‘){

// 设置多个样式

}else if(typeof name == ‘string‘){

// 通过getComputedStyle获取

}

}

return this;

}

}

// 最关键的一步

jQuery.prototype.init.prototype = jQuery.fn;

// 暴露给全局

window.jQuery = window.$ = jQuery;

})(window)

</script>

原文地址:https://www.cnblogs.com/sacon520/p/9940146.html

时间: 2024-11-11 14:31:41

封装自己的jquery框架的相关文章

js框架封装,模拟jQuery封装

模拟jQuery框架,利用原生的js技术,封装一个js框架,以加深对jQuery的常用api的使用和面向对象原理的理解:一:结构部分首先利用闭包,构造一个自执行函数,然后利用选择器函数Sizzle,获取dom元素:其后设置入口函数jQuery,返回一个F的实例:然后对jQuery.prototype进行设置:其后修改F的原型指向jQuery的原型,最后暴露出去两个接口$和jQuery:二:jQuery.fn.extend = jQuery.extend = function(){}通过向jQue

简单模拟jQuery创建对象的方法,以及封装一个js动画框架

今天无事点开了N年未点开的慕课网,看了一个js动画框架的视频,心血来潮用jQuery的方法封装了一下,虽然不如jQuery,但是还是有点点所获. 什么都不说,直接上代码: /** * 这是框架的唯一对象,使用jQuery框架的创建方法 * @class MyAnimation * @constructor */ function MyAnimation(Selector){ //返回MyAnimation原型链中init()方法创建的对象 return new MyAnimation.proto

关于angularjS与jQuery框架的那些事

这篇文章主要介绍了jQuery和angularJS的区别浅析,本文着重讲解一个熟悉jQuery的程序员如何应对angularJS中的一些编程思想的转变吗,需要的朋友可以参考下 最近一直研究angularJs最大的感受就是它和之前的jQuery以及jQuery各种库的设计理念完全不一样.如果不能认识到这一点,而对于之前做jQuery开发的程序员,去直接学习angularJs的话,很可能学了很久还不知道这个东西到底是什么,拿来做什么的,怎么和UI进行结合等问题,我也是到处找资料看了看,在此把自己学习

浅析jQuery框架与构造对象

这是一些分析jQuery框架的文字    面向的读者应具备以下要求 1.非常熟悉HTML 2.非常熟悉javascript语法知识 3.熟悉javascript面向对象方面的知识 4.熟练使用jQuery框架 言归正传! jQuery对象的初始化是写在匿名函数里的 就像这样: (function(){alert("jQuery框架分析")})(): 第一个括号是声明了一个函数,第二个括号是执行这个函数.也就是说,jQuery框架在页面载入的时候已经做了一些事情(这个个匿名函数已经被执行

jQuery框架学习

之前也看过jquery库源码,网上也有很多对于jquery框架的分析教程,但是最近又想花点时间重新学习.jquery问世以来受到了广大的前端开发者的青睐,对于很多前端开发者来说,走上前端的道路不是从写原生javascript开始而是基本上都是从写jquery开始的,甚至对于后端开发者来说,对于他们来说jquery也能轻松上手.那么jquery为什么能这么受欢迎呢,我个人见解,  首先,jquery封装了许多操作dom的方法和一些工具方法,对于各浏览器兼容性做到了完美的兼容,对于jquery 2.

封装自己的Ajax框架

Ajax技术就是利用javascript和xml实现异步交互的功能. 首先先来介绍一下Ajax相关知识点 一.Ajax对象的创建 1.创建Ajax对象的方式 a.第一种方式是针对IE浏览器 b.第二种方式针对w3c:在IE的高版本(IE8+),已经支持了XMLHttpRequest类 2.解决兼容性 a.创建公共文件 public.js b.在需要使用ajax对象的页面中,包含以上js文件 二.ajax对象的相关属性和方法 方法: 1.初始化ajax对象 open(method,url)  me

封装一个类似jquery的ajax方法

//封装一个类似jquery的ajax方法,当传入参数,就可以发送ajax请求 //参数格式如下{ // type:"get"/"post", // dataType:"json"/"jsonp", // url:"地址", // data:{key:value} // success:function(){ // } // } //还需要一个跨域方法,可以访问远程服务器的数据 function myAja

引用jquery框架后出错

问题描述:当引用了jquery框架后,页面的js不能正常工作. 后面我的解决办法:是因为在引用 jquery的框架时的代码为 <script type="text/javascript" src="resources/js/jquery/jquery-1.9.1.min.js" /> 改为如下的引用方式 <script type="text/javascript" src="resources/js/jquery/jq

Java项目在jsp页面中引入jquery框架的步骤

环境:在Java  web项目中引入juqery框架 工具:MyEclipse8.5 [步骤如下] A:新建一个Java web项目TestJquery,在WebRoot目录下创建一个jquery文件夹 B:下载jquery-1.8.3.min.js放入jquery文件夹中 C:创建jsp页面 <%@ page language="java" import="java.util.*" pageEncoding="ISO-8859-1"%&g