jQuery - 概述

jQuery - 基础知识

jQuery是一个使用JavaScript功能构建的框架.因此，您可以使用JavaScript中提供的所有功能和其他功能.本章将解释大多数基本概念，但经常在jQuery中使用.

String

JavaScript中的字符串是一个不可变对象，不包含任何一个，一个或很多人物.以下是JavaScript String&minus的有效示例;

"This is JavaScript String"
'This is JavaScript String'
'This is "really" a JavaScript String'
"This is 'really' a JavaScript String"

数字

JavaScript中的数字是双精度64位格式IEEE 754值.它们是不可变的，就像字符串一样.以下是JavaScript数字的有效示例 :

5350 
120.27 
0.26

布尔值

JavaScript中的布尔值可以是 true 或 false .如果数字为零，则默认为false.如果空字符串默认为false.

以下是JavaScript Boolean&minus的有效示例;

true      // true
false     // false
0         // false
1         // true
""        // false
"hello"   // true

对象

JavaScript非常支持Object概念.您可以使用对象文字创建一个对象，如下所示;

var emp = {
   name: "Zara",
   age: 10
};

您可以使用点符号来编写和读取对象的属性，如下所示 :

// Getting object properties
emp.name  // ==> Zara
emp.age   // ==> 10

// Setting object properties
emp.name = "Daisy"  // <== Daisy
emp.age  =  20      // <== 20

数组

您可以使用数组文字定义数组，如下所示;

var x = [];
var y = [1, 2, 3, 4, 5];

数组具有长度属性，可用于迭代和减去;

var x = [1, 2, 3, 4, 5];

for (var i = 0; i < x.length; i++) {
   // Do something with x[i]
}

函数

JavaScript中的函数可以是命名函数，也可以是匿名函数.命名函数可以使用 function 关键字定义如下 :

function named(){
   // do some stuff here
}

匿名函数可以像普通函数一样定义，但它没有任何名称.

可以将匿名函数分配给变量或传递给方法，如下所示.

var handler = function (){
   // do some stuff here
}

JQuery非常频繁地使用匿名函数跟随 :

$(document).ready(function(){
   // do some stuff here
} );

参数

JavaScript变量参数是一种具有的数组长度属性.下面的例子解释得非常好&减去;

function func(x){
   console.log(typeof x, arguments.length);
}

func();                //==> "undefined", 0
func(1);               //==> "number", 1
func("1", "2", "3");   //==> "string", 3

arguments对象还有一个 callee 属性，它指的是你所在的函数.例如 :

function func() {
   return arguments.callee; 
}

func();                // ==> func

上下文

JavaScript着名关键字此始终引用当前上下文.在函数中，此上下文可以更改，具体取决于函数的调用方式和减号;

$(document).ready(function() {
   // this refers to window.document
});

$("div").click(function() {
   // this refers to a div DOM element
});

您可以使用函数内置方法 call()和 apply指定函数调用的上下文()方法.

它们之间的区别在于它们如何传递参数.调用将所有参数作为参数传递给函数，而apply接受一个数组作为参数.

function scope() {
   console.log(this, arguments.length);
}

scope() // window, 0
scope.call("foobar", [1,2]);  //==> "foobar", 1
scope.apply("foobar", [1,2]); //==> "foobar", 2

范围

变量的范围是程序所在的区域定义. JavaScript变量只有两个范围.

全局变量 : 全局变量具有全局范围，这意味着它在JavaScript代码中的任何位置定义.
局部变量 : 局部变量仅在定义它的函数中可见.函数参数始终是该函数的本地函数.

在函数体内，局部变量优先于全局变量相同名称和减号;

var myVar = "global";     // ==> Declare a global variable

function ( ) {
   var myVar = "local";   // ==> Declare a local variable
   document.write(myVar); // ==> local
}

回调

回调是作为参数传递给某个方法的普通JavaScript函数或选项.一些回调只是事件，被调用以使用户有机会在触发某个状态时做出反应.

jQuery的事件系统在所有地方都使用这样的回调，例如 :

$("body").click(function(event) {
   console.log("clicked: " + event.target);
});

大多数回调都提供参数和上下文.在事件处理程序示例中，使用一个参数(一个事件)调用回调.

返回某些内容需要一些回调，其他回调值是可选的.为了防止表单提交，提交事件处理程序可以返回false，如下所示 :

$("#myform").submit(function() {
   return false;
});

闭包

只要在某个内部范围内访问在当前作用域之外定义的变量，就会创建闭包.

以下示例显示变量计数器在创建，增量和打印功能中是如何可见的，但不在它们之外和减去;

function create() {
   var counter = 0;
	
   return {
      increment: function() {
         counter++;
      },
	   print: function() {
         console.log(counter);
      }
   }
}

var c = create();
c.increment();
c.print();     // ==> 1

此模式允许您使用对外部世界不可见的数据进行操作的方法创建对象.应该注意的是，数据隐藏是面向对象编程的基础.

代理模式

代理是一个可用于控制对另一个对象的访问的对象.它实现与此其他对象相同的接口，并将任何方法调用传递给它.这个其他对象通常被称为真实主题.

可以实例化代理来代替这个真实主题，并允许远程访问它.我们可以在一个闭包中保存jQuery的setArray方法并将其覆盖如下 :

(function() {
   // log all calls to setArray
   var proxied = jQuery.fn.setArray;

   jQuery.fn.setArray = function() {
      console.log(this, arguments);
      return proxied.apply(this, arguments);
   };
	
})();

上面将其代码包装在一个隐藏代理变量的函数中.然后，代理会记录对方法的所有调用，并将调用委托给原始方法.使用 apply(this，arguments)可以保证调用者无法注意到原始方法和代理方法之间的区别.

内置函数

JavaScript附带了一组有用的内置函数.这些方法可用于操作字符串，数字和日期.

以下是重要的JavaScript函数 :

Sr.No.	方法&说明
1	charAt() 返回指定索引处的字符.
2	concat() 结合文字两个字符串并返回一个新字符串.
3	forEach() 为数组中的每个元素调用一个函数.
4	indexOf() 返回第一次出现指定值的调用String对象中的索引，如果找不到则返回-1.
5	length() 返回字符串的长度.
6	pop() 从数组中删除最后一个元素并返回该元素.
7	push() 添加一个或更多元素到数组的末尾并返回数组的新长度.
8	反向() 反转元素的顺序一个数组 - 第一个成为最后一个，最后一个成为第一个.
9	sort() 对数组的元素进行排序.
10	substr() 返回从指定位置开始通过指定字符数的字符串中的字符.
11	toLowerCase () 返回转换为小写的调用字符串值.
12	toString() 换货政... rns数字值的字符串表示.
13	toUpperCase() 返回转换为大写的调用字符串值.

文档对象模型

文档对象模型是各种元素的树结构HTML的格式如下 :

在线演示

<html>
   <head>
      <title>The jQuery Example</title>
   </head>
	
   <body>
      <div>
         <p>This is a paragraph.</p>
         <p>This is second paragraph.</p>
         <p>This is third paragraph.</p>
      </div>
   </body>
</html>

这将产生以下结果 :

以下是关于上述树结构的重要观点 :