WEB开发网
开发学院网页设计JavaScript jQuery.API源码深入剖析以及应用实现 - 核心函数... 阅读

jQuery.API源码深入剖析以及应用实现 - 核心函数篇

 2010-09-14 13:38:00 来源:WEB开发网   
核心提示:前言Jquery(http://jquery.com/)是一个轻量级,快速简洁的Javascript框架,jQuery.API源码深入剖析以及应用实现 - 核心函数篇,它的容量小巧,简洁和简短的语法,还是DOM元素呢?现在我们来深入剖析Jquery源码,2. 这里,容易记;用户能更方便地处理HTML DOM、Event

前言

Jquery(http://jquery.com/)是一个轻量级,快速简洁的Javascript框架,它的容量小巧,简洁和简短的语法,容易记;用户能更方便地处理HTML DOM、Events、实现动画效果,并且提供Ajax的支持。目前最新版本为jQuery 1.3.1(http://jqueryjs.googlecode.com/files/jquery-1.3.1.js),这系列文章将对该版本的源码进行阐述。

现在开始本系列的第一篇,Jquery核心函数,内容主要包括:

jQuery.API源码深入剖析以及应用实现(1) - 核心函数篇

分析

1. 在Jquery的应用开发中,我们经常看到这样的代码:

$("div.container").css("display","none");//将div节点下样式值为container的节点设置为不显示
varwidth=$("div.container").width();//得到div节点下样式值为container的宽度
varhtml=$(document.getElementById("result")).html();//得到id为result的节点的innerHTML值
$("#result",document.forms[0]).css("color","red");//将在第一个Form节点下id为result的字体颜色设置为红色
$("<div>hello,world</div>").appendTo("#result");//将HTML字符串信息内部追加到id为result的节点末尾

那么$(...)里面的参数,Jquery API中是怎样辨认参数是表达式,id,HTML字符串,还是DOM元素呢?

现在我们来深入剖析Jquery源码。

2. 这里,我先来做个测试,我将Jquery API简化为这样的代码:

(function(){
  varwindow=this,
  
  jQuery=window.jQuery=window.$=function(selector,context){
    returnnewjQuery.fn.init(selector,context);
  };
  
  jQuery.fn=jQuery.prototype={
    init:function(selector,context){
      alert(selector);//弹出警告框
    }
  };
})();
window.onload=function(){
  $("div.container");//得到“div.container”
  $("#result");//得到“#result”
  $("<div>hello,world</div>");//得到“<div>hello,world</div>”
  $(document.getElementById("result"));//得到“[object]”
}

1 2 3 4 5 6  下一页

Tags:jQuery API 源码

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接