作为一个从来没有认真学过jQuery的菜来讲,我所学的都是jQuery基础。

算是让自己从0开始系统学一遍吧。学习书籍为:《锋利的jQuery》。

虽然是个序,表示一下我是个菜,但还是来几个jQuery最基本的点吧。

  • $是jQuery的简写形式,$("#divId")和jQuery("#divId")是一样的效果。其实看到这个,学过JS的人都应该很清楚了,jQuery就是个函数对象,有个别名叫$

    • <html>
      <head>
      <script src="jquery-2.2.0.min.js"></script>
      <script>//因为放在一个文件里比较直观,所以并没有用单独的js文件写js代码
      $(document).ready(function(){//页面加载玩Dom结构后执行
      alert("Hello world!");
      });
      $(function(){//这是上面那种写法的简写模式
      alert("Hello world!");
      });
      </script>
      </head>
      <body>
      </body>
      </html>
  • jQuery可以用链式操作风格,目测就是JS函数执行完后返回this以实现这种风格。下面是对链式风格的建议:

    • 对于同一对象的链式操作,不超过三个的可以写成一行
    • 对于同一对象的链式操作,超过三个的建议每行写一个操作
    • 对于多个对象的少量操作,可以每个对象写一行,如果涉及子元素,可以适当缩进
  • jQuery与Dom对象的关系
    • DOM(Document Object Model,文档对象模型),每一分DOM都可以表示为一个树
    • jQuery对象是通过jQuery包装DOM对象后产生的对象,在jQuery里无法使用DOM对象的任何方法。
    • 如果我们在写代码的时候得到的是一个jQuery对象,那么就在变量命名的前面加一个$,这样阅读代码更简单一点。
    • jQuery提供了两种方法将一个jQuery对象转换为DOM对象,即[index]和get(index).
    • 而DOM对象转换为jQuery对象只需要用$(DOM对象)即可
  • jQuery与其它库的冲突
    • 在jQuery库中,几乎所有插件都被限制在他自己的命名空间中。因此将jQuery对象和其它库(如:YUI,MooTools)放到一起使用不会出现冲突。
    • 可以用jQuery.noConflict()将控制权移交给其它库。
      //jQuery在其它库之后导入
      //如果要用$来操作其它库的$方法
      var $j=jQuery.noConflict();//自定义一个快捷方式
      $j(document).ready(function(){//可以使用$j来当做$调用jQuery
      alert("Hello world!");
      });
      //如果坚持要用$来操作jQuery方法
      //虽然作者给出了解决方法,但是我依然不想理会,因为它会比上面的方式难懂
      //所谓更难理解阅读,并且有上面那种好的方案替代,那么在我的脑海里就表示难以阅读的方法是错的,我选择看不见 //jQuery在其它库之前导入
      //那么直接用jQuery代替$操作jQuery好了,无需调用jQuery.noConflict()方法
      jQuery(document).ready(function(){
      alert("Hello world!");
      });

【jQuery基础学习】00 序的更多相关文章

  1. JQuery基础学习总结

    JQuery基础学习总结 简单总结下JQuery: 一:事件 1.change事件 <!DOCTYPE html> <html lang="en"> < ...

  2. 【jQuery基础学习】09 jQuery与前端(这章很水)

    这章主要是将如何将jQuery应用到网站中,或者说其实就是一些前端知识,对于我这种后端程序来说其实还是蛮有用的. 关于网站结构 文件结构 前端文件分三个文件夹放 images文件夹用来存放将要用到的图 ...

  3. jQuery 基础学习笔记总结(一)

    Jquery 学习笔记 总结 感想: 此前在做站点时用到过jquery相关,特别是Ajax相关技术.但是并没有系统的进行学习和了解Jquery的强大的功能,趁这几天跟着资料基本的了解下Jquery的特 ...

  4. 【总结整理】JQuery基础学习---动画

    jQuery中隐藏元素的hide方法 让页面上的元素不可见,一般可以通过设置css的display为none属性.但是通过css直接修改是静态的布局,如果在代码执行的时候,一般是通过js控制元素的st ...

  5. Linux 基础学习篇 序篇

    读序篇可以知道的: 1.有些指令知道前和知道后,自己的操作是完全不同的,可能知道前,会用reset把系统重新启动一遍,而知道后会使用ps和kill来关闭进程. 2.如果对Linus的学习知识" ...

  6. 【jQuery基础学习】12 jQuery学习感想

    学习完<锋利的jQuery>,用时13天. 这期间,私底下又用了一点时间去W3C上把HTML和CSS重新过了一遍. 总的来说,收获还是蛮多的. 其实在本书里面真正重要的也就前几章,后面的都 ...

  7. 【jQuery基础学习】08 编写自定义jQuery插件

    目的:虽然jQuery各种各样的功能已经很完善了,但是我们还是要学会自己去编写插件.这样我们可以去封装一些项目中经常用到的专属的代码,以便后期维护和提高开发效率. jQuery插件的类型: 封装对象方 ...

  8. 【jQuery基础学习】06 jQuery表单验证插件-Validation

    jQuery的基础部分前面都讲完了,那么就看插件了. 关于jQuery表单验证插件-Validation validation特点: 内置验证规则:拥有必填.数字.E-Mail.URL和信用卡号码等1 ...

  9. jQuery基础学习(二)—jQuery选择器

    一.jQuery基本选择器 1.CSS选择器     在学习jQuery选择器之前,先介绍一下之前学过的CSS选择器. 选择器 语法 描述 示例   标签选择器 E {                 ...

随机推荐

  1. Discuz! 的编码规范

    http://open.discuz.net/?ac=document&page=dev_coderule 前言 本规范由编程原则组成,融合并提炼了开发人员长时间积累下来的成熟经验,意在帮助形 ...

  2. hive报lzo Premature EOF from inputStream错误

    今天dw组同事发邮件说有一个问题让帮解决一下.他们自己没能搞得定.下面问题解决过程: 1.hql insert overwrite table mds_prod_silent_atten_user p ...

  3. Kafka - SQL 引擎分享

    1.概述 大多数情况下,我们使用 Kafka 只是作为消息处理.在有些情况下,我们需要多次读取 Kafka 集群中的数据.当然,我们可以通过调用 Kafka 的 API 来完成,但是针对不同的业务需求 ...

  4. 【Cocos2d-Js基础教学(5)资源打包工具的使用及资源的异步加载处理】

    TexturePacker是纹理资源打包工具,支持Cocos2dx的游戏资源打包. 如果用过的同学可以直接看下面的资源的异步加载处理 首先为什么用TexturePacker? 1,节省图片资源实际大小 ...

  5. JVM性能分析与优化

    JVM性能分析与优化: http://www.docin.com/p-757199232.html

  6. 领域驱动开发推荐代码示例 — Microsoft NLayerApp

    简介: Microsoft NLayerApp是由微软西班牙团队出品的基于.NET 4.0的“面向领域N层分布式架构”代码示例,在codeplex上的地址是:http://microsoftnlaye ...

  7. [转载]IE678兼容性前缀区分

    符合一贯简单的风格,只需记住两个符号 _ 和 * 看例子: #main { background:black; *background:red; _background:blue; } 第一句会被所有 ...

  8. vs2010 rdlc .net4.0 卸载 Appdomain 时出错。 (异常来自 HRESULT:0x80131015) 解决办法

    网上一看Appdomain出错,绝大部分都是说控件加载错误.经测试在.net 4.0环境下 rdlc报表很容易发生卸载 Appdomain 时出错. (异常来自 HRESULT:0x80131015) ...

  9. ThinkJS 项目用 WebStorm 来设置断点与调试

    1. 前置条件.已按ThinkJS 2.0 文档 之 <创建项目> 建好项目. 说明a: 本示例创建项目名为wagang,使用es6配置: thinkjs new wagang --es6 ...

  10. 字符集与Mysql字符集处理(二)

    接着上篇文章继续讲字符集的故事.这一篇文章主要讲MYSQL的各个字符集设置,关于基础理论部分,参考于这里.   1. MYSQL的系统变量 – character_set_server:默认的内部操作 ...