jQuery工作原理解析
本文最后更新于 6345 天前,其中的信息可能已经有所发展或是发生改变。

jQuery的开篇声明里有一段非常重要的话:jQuery是为了改变javascript的编码方式而设计的,从这段话可以看出jQuery本身并不是UI组件库或其他的一般AJAX类库.jQuery改变javascript编码方式!

jQuery就是以这种可以说是最简单的编码逻辑来改变javascript编码方式的.这两个步骤是jQuery的编码逻辑核心!要实现这种简洁编码方式,创建jQuery对象这一环节至关重要.因此,jQuery的dom元素查找能力相当强悍.此外,jQuery对象的方法肯定是有限的,有限的方法满足不了日益增长各有所需的要求,所以,必须提供jQuery对象方法的扩展能力.

< !DOCTYPE html PUBLIC ”-//W3C//DTD XHTML 1.0 Transitional//EN” ”http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml” >
<head>
    <title>无标题页</title>
</head>
<body id=”bd”>
<a href=”http://www.baidu.com”>baidu</a>
</body>
</html>
<script type=”text/javascript” src=”../Script/jquery.js”></script>
<script type=”text/javascript” >
$(function(){
    $(“a“).click(function(e){//1)查找$(”a”);2)jQuery对象事件click;3)jQuery对象方法hide
        $(this).hide(“slow“);
        return false;
    });
});
</script>

jQuery中有一个\”配置”的思想,这一点使得对象的属性/事件等设置变得容易理解且十分简便,如下一个拖拽组件的初始化:

$(document).ready(
    function()
    {
        $(’#drag1′).Draggable({
            handle: “ax“,               //属性设置
            onStart: function(el,x,y){  //事件监听器设置
            }
        });
    }
);

可以看到,$(”#drag1″)是查找并创建一个jquery对象,然后调用Draggable方法进行拖拽初始化,在此方法调用时,传递一个\”配置”对象,进行拖拽操作的初始化配置.这一”配置”的思想,极大简化了一些编码步骤,并相当直观和易懂.

以下我进行三个问答:

本文以下内容由于已经不具备可参考性而被删除,删除时间为2023年11月17日。

评论

  1. zl13354096
    17 年前
    2007-6-21 15:53:20

    楼主的语言解说风格我很喜欢,并且也将jQuery的核心用很简洁的字眼阐述出来,还附上自己的示例,谢谢。

  2. 博主
    17 年前
    2007-6-24 1:14:50

    忘记在哪里转的了
    不过写的确实不错

  3. cloudandy
    17 年前
    2007-12-11 17:24:19

    写的不错,简单明了,还有DEMO

  4. lovekugua
    13 年前
    2012-1-12 22:20:52

    的确写的很好,用简单的示例让我明白了jquery的核心

  5. 12 年前
    2012-5-08 8:34:26

    写的不错 回复表支持

  6. 小马哥
    12 年前
    2013-2-09 22:07:39

    根本运行不了,我操,最后写的完全不对

    • BIGBOSS
      小马哥
      11 年前
      2013-10-31 16:53:26

      可以运行,双引号是中文字符,改成因为就行了。作者写得真好。

  7. 10 年前
    2014-9-11 0:53:37

    请问一下。
    [].push.apply( this, arr );
    这是什么意思?谢谢。

    • MM
      8 年前
      2016-5-26 22:34:36

      相当于for (){ [].push)(i) }

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇