`

学习jQuery高级编程(一)

阅读更多
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript" src="../jQuery/jquery-1.9.1.js"></script>
    <script type="text/javascript">
        jQuery(document).ready(function(){
            console.info("Hello World!");
            var obj = null;
            console.info(jQuery.isPlainObject(obj));
            obj = {};
            console.info(jQuery.isPlainObject(obj));
            obj = new Object();
            console.info(jQuery.isPlainObject(obj));
            //在javascript中,所有数值都是64位双精度的。整数和浮点数之间并没有区别
            console.info(typeof 1);
            console.info(typeof 1.5);
            var thisMonment = new Date();
            console.info(thisMonment);
            console.info(thisMonment.getFullYear());
            try{
                throw new Error("something really bad happened");
            }catch (e){
                console.info(e.name+" : "+ e.message);
            }
            //一个变量可以进行多次声明
            i = 0; //隐式声明
            console.info("delete i : " + (delete i));
            var i = 0; //显示声明,变量是持久的不能进行删除
            console.info("delete i : " + (delete i));
            var x; //undefined,默认是undefined
            /**
             * 各种不同的类型
             Error
             EvalError
             RangeError
             ReferenceError
             SyntaxError
             TypeError
             URIError
             */
            try{
                //函数内外声明了相同的变量,函数体内局部变量将取代全局变量
                (function(){
                    var v1 = "local scope";
                    v2 = "global scope";
                })();
                console.info(v1);
                console.info(v2);
            }catch (e){
                console.info(e +" : "+ e.type +" " + e.message);
            }
            //创建对象
            //构造函数
            function ZombieObject(name){
                this.name = name;
            }
            var smallZombieObject = new ZombieObject("zhangsan");
            //使用字面量创建对象,类似于其他语言的三列(hash)或关联数组
            var myObject = {};
            var objWithProperties = {
                "name" : "zhangsan",
                "myObjectAsProperty" : myObject
            };
            //采用[]访问时属性可以是javascript关键字和变量,.方式不行
            console.info(objWithProperties["name"] +"  "+objWithProperties.name);
            //遍历对象的属性
            for(prop in objWithProperties){
                console.info(prop +" : "+ objWithProperties[prop]);
            }
            //基于原型的继承示例
            function Monster(type){
                this.type = type;
            }
            Monster.prototype.getType = function(){
                return this.type;
            }
            function Zombie(name){
                this.name = name;
            }
            Zombie.prototype = new Monster();
            Zombie.prototype.eatPeople = function(){
                console.info("tastes like chicken");
            }
            var smallZombie = new Zombie();
            smallZombie.eatPeople();
            console.info(delete Zombie.prototype.eatPeople);
            //对象是自知的self-aware,对象知道自己的属性,可以使用hasOwnProperty()方法,返回一个Boolean值
            console.info(smallZombie.hasOwnProperty("name"));
            console.info(smallZombie.hasOwnProperty("eatPeople"));

            //函数没有返回一个特定的值,则它将返回一个undefined值。
            console.info((function(){})());
            /**
             * 函数的两个特性
             * 1、函数作为参数传递给其他函数
             * 2、匿名函数
             */
            function repoter(fn){
                console.info("the return value of your function is "+fn());
            }
            repoter(function(){});
            repoter(function(){
                return " a simple string";
            });
            console.info("=========函数=========");
            /**
             * 自执行函数
             * 将函数表达式包装在一对圆括号中[()()],
             * 将迫使javascript引擎将function(){}块识别成一个函数表达式,
             * 而不是一个函数语句开始
             */
            console.info("=========自执行函数=========");
            (function(x,y){
                console.info("自执行函数:"+(x+y));
            })(5,6);
            console.info("=========闭包简介=========");
            //无论在外部作用域中X的值发生了什么变化,闭包将记住函数执行时变量X的值
            var x = 10;
            console.info("x = "+x);
            var message = (function(param){
                return function(){
                    console.info("闭包中的值:"+ param);
                };
            })(x);
            message(x);
            x = 100;
            console.info("x = "+x);
            message(x);
            //eval函数和setTimeOut函数具有自己独立的执行上下文
            console.log(this);
            /**
             * 在javascript中,作用域维持在函数级别而并非块级别。
             * 除了不能访问this和参数外(this和参数有调用执行者传入),嵌套函数可以访问外部函数定义的变量
             * 闭包:即使在外部函数执行结束后,内部嵌套函数继续保持它对外部函数的引用。闭包还有助于解决命名冲突
             * 每次调用一个包裹的函数时,代码虽然没有变换但是javascript将为每一次调用创建一个新的作用域
             */
            function getFunction(value){
                return function(value){
                    console.info(this);
                    return value;
                }
            }
            var a = getFunction(),
                b = getFunction(),
                c = getFunction();
            console.info(a(0));
            console.info(b(1));
            console.info(c(2));
            console.info(a === b);
            //闭包保持对外部函数的引用
            var obj = {};
            obj.method = function(){
                var that = this;
                this.counter = 0;
                var count = function(){
                    that.counter++;
                    console.info(that.counter);
                }
                count();
                count();
                console.info(this.counter);
                return count;
            }
            var test = obj.method();
            //实现私有方法和属性,使用闭包
            console.info("=========实现私有方法和属性,使用闭包==========");
            function TimeMachine(){
                //共有成员
                //私有成员
                var destination = "2015-05-28";
                this.getDestination = function(){
                    return destination;
                }
            }
            var delorean = new TimeMachine();
            console.log(delorean.getDestination());
            //访问不到变量
            console.log(delorean.destination);

            /**
             * 使用模块
             * 模块模式是一种简单而流行的方式,用于创建自包含的、模块化的代码。
             * 创建一个模块,只需要声明一个名称空间、将有关函数绑定于该名称空间,并定义私有成员和专有成员即可
             */
            var TIMEMACHINE = {};
            TIMEMACHINE.createDelorean = (function(){
                //私有成员--感觉这个没有使用
                var destination = "";
                var model = "";
                var fuel = "";

                //共有方法
                return {
                    //设置器
                    setDestination : function(dest){
                        this.destination = dest;
                    },
                    setModel : function(model){
                        this.model = model;
                    },
                    setFuel : function(fuel){
                        this.fuel = fuel;
                    },
                    //访问器
                    getDestination : function(){
                        return this.destination;
                    },
                    getModel : function(model){
                        return this.model;
                    },
                    getFuel : function(fuel){
                        return this.fuel;
                    },
                    toString : function(){
                        console.info(this.getModel() + " " + this.getFuel() +" " +this.getDestination());
                    },
                    toString2 : function(){
                        console.info(destination + " " + fuel +" " + model);
                    }
                };
            })();
            var myMachine = TIMEMACHINE.createDelorean;
            myMachine.setDestination("zhangsan");
            myMachine.setModel("开挂模式");
            myMachine.setFuel("哈哈,不认识这个单词!");
            myMachine.toString();
            myMachine.toString2();

            //json javascript object notation
            var list = [1,"2",3,4];
            console.info(list);
            //删除元素内容,不改变元素长度
            delete list[0];
            console.info(list);
            console.info(list.length);
            console.info("=====扩展类型=====");
            String.prototype.boolean = function(){
                return "true" == this;
            }
            console.info("false".boolean());
            //类型转换
            var good = parseInt("010",10);
            console.info(good);
            var better =  + "010";
            console.info(better);
            //eval()函数可以接受一个字符串,并将视为javascript代码执行。
            // 应该限制eval的使用,它容易在代码中引入各种各样严重的问题
            $("#submit").click(function(){
                $.ajax({
                    url:"/place2post.php",
                    type:"post",
                    success:function(){
                        //成功代码
                    }
                });
            });
        });
    </script>
</head>
<body>

</body>
</html>

 

 

分享到:
评论

相关推荐

    jquery高级编程

    jquery高级编程文档,学习文档,学习文档,学习文档。

    jQuery高级编程,中文完整扫描版

    jQuery高级编程 高清PDF完整版.pdf 个人收集电子书,仅用学习使用,不可用于商业用途,如有版权问题,请联系删除!

    XMPP高级编程——使用JavaScript和JQuery 附带的源码

    本资源是《XMPP高级编程——使用JavaScript和JQuery》一书附带的源码,十分详细,搭载在服务器上可直接运行。如果要用自己搭建的Openfire之类的XMPP服务器,修改也十分简单,是学习Web环境下的XMPP协议开发的好资料...

    XMPP高级编程 使用JavaScript和jQuery

    《xmpp高级编程——使用java*和jquery》将教您如何在自己的应用程序中发挥xmpp的强大威力,并向您展示如何利用xmpp构建下一代应用程序或向当前应用程序中添加新功能所需的所有工具。本书的特色是采用java*语言进行...

    jquery高级编程的最佳实践详解

    主要介绍了jquery高级编程的最佳实践详解,学习JQ的朋友一定需要这个,参考下吧

    jquery组件编程,里面有丰富的组件,让你快速熟悉

    jquery编程技巧能让你快速学习,里面有丰富的文档,也有自己实战经验,

    jQuery高级编程之js对象、json与ajax用法实例分析

    本文实例讲述了jQuery高级编程之js对象、json与ajax用法。分享给大家供大家参考,具体如下: js对象 创建js对象的两种方式: 1.通过new Object创建: var p1 = new Object(); // 设置属性,和方法 p1.name = 张三; ...

    ASP.NET MVC 4高级编程(包含源码)

    由Microsoft专家和极受敬重的软件开发社区负责人撰写的《ASP.NET MVC 4高级编程(第4版)》将带您学习最前沿的Web框架:ASP.NET MVC 4。本书开篇简要介绍ASP.NET MVC框架,然后直奔主题,讨论使用ASP.NET和最新...

    ASP.NET MVC 4高级编程(第4版)中文版 超清晰PDF及配套源码Part1

    ASP.NET MVC 4高级编程(第4版)中文版 高清扫描,学习ASP.NET MVC4圣典之作,一册在手,拨云见日。(因超出本人可上传大小限制,只好分卷上传,请同时下载part1和part2后再解压)。本书简明易懂,用趣味的引导方式...

    ASP.NET MVC 4高级编程(第4版)中文版 超清晰PDF

    MVC专家“梦之队”对ASP.NET MVC 4的全新诠释 由Microsoft专家和极受敬重的软件开发社区负责人撰写的《ASP.NET MVC 4高级编程(第4版)》将带您学习最前沿的Web框架:ASP.NET MVC 4。本书开篇简要介绍ASP.NET MVC框架...

    XMPP高级编程所需的js和css文件

    包含的文件有: checkplayer.js,flensed.js,flXHR.js,flXHR.swf,hello.js,jquery-3.1.1.js,jquery-ui.js,js_flie.zip,strophe....正在学习XMPP高级编程——使用Javascript和jQuery,一起学习^_^,小小一分意思一下!

    ASP.NET MVC 4高级编程.rar

    对ASP.NET MVC 4的全新诠释 由Microsoft专家和极受敬重的软件开发社区负责人撰写的《ASP.NET MVC 4高级编程(第4版)》将带您学习最前沿的Web框架:ASP.NET MVC 4。本书开篇简要介绍ASP.NET MVC框架,然后直奔主题,...

    JavaScript和jQuery实战手册-麦克法兰.pdf

    从基本的Web搭建等基础知识,到jQuery、CSS、Ajax等高级知识……几乎面面俱到,广度与深度兼备。 全书通过大量代码示例说明图的方式说明代码的工作机制,以及各个部分的作用和功能,引导读者在实践中学习和领悟...

    mvc3高级编程英文版

    帮助您开始创建您的第一个ASP.NET MVC 3 应用程序。 第2 章讲解控制器和操作的基础内容。您开始编写一些基本的“hello world”示例, 然后创建从URL 中提取信息并在屏幕上显示的应用程序。 第3 章介绍如何从控制器...

    Android Web Game App高级编程——使用HTML5、 CSS3、JavaScript.zip

    品名:Android Web Game App高级编程——使用HTML5、 CSS3、JavaScript.zip 用途:移动开发人员HTML5及javascript 与 jQuery 铁粉珍爱学习资料,移动开发或学习爱好者不可多得的学资料,本教程出自清华大学出版社,...

    最新Python3.5零基础+高级+完整项目(28周全)培训视频学习资料

    最新Python3.5零基础+高级+完整项目(28周全)培训视频学习资料;本资料仅用于学习。 【课程内容】 第1周 开课介绍 python发展介绍 第一个python程序 变量 字符编码与二进制 字符编码的区别与介绍 用户交互程序 if ...

    学习软件.pdf

    jquery,高级编程,好好学习,天天向上

    python系统化学习初中高级视频教程

    [15] pythn实用编程技巧进阶(附赠: 建议学习) [12] 闭包和装饰器 [01] linux基础命令 [07] JavaScript基础 [05] http和web服务器 [03] 多任务线程(2) [06] htm和css前端开发 [14] 正则表达式 [09] Mysq数活库的基本...

    常用jQuery选择器汇总

    学习【js DOM 编程艺术】,最后面有许多jQuery的选择器,每个都动手敲了一遍。 jQuery 提供了高级选择器的方法。 j s获取元素的三个基本方法分别是通过标签名,类名和id,即(getElementsByTagName, ...

    jQuery右侧悬浮蓝色在线客服代码

    [Csharp高级编程(第6版)](共8压缩卷) http://download.csdn.net/album/detail/667 10个[精品资源]Java学习资料合辑[一] http://download.csdn.net/album/detail/663 10个C#Socket编程代码示例 ...

Global site tag (gtag.js) - Google Analytics