Jquery第一篇【介绍Jquery、回顾JavaScript代码、JS对象与JQ对象的区别】

什么是Jquery?

Jquey就是一款跨主流浏览器的JavaScript库,简化JavaScript对HTML操做javascript

就是封装了JavaScript,可以简化咱们写代码的一个JavaScript库html

为何要使用Jquery?

我以为很是重要的理由就是:它可以兼容市面上主流的浏览器,咱们学习AJAX就知道了,IE和FireFox获取异步对象的方式是不同的,而Jquery可以屏蔽掉这些不兼容的东西java

  • (1)写少代码,作多事情【write less do more】
  • (2)免费,开源且轻量级的js库,容量很小
    • 注意:项目中,提倡引用min版的js库
  • (3)兼容市面上主流浏览器,例如 IE,Firefox,Chrome
    • 注意:jQuery不是将全部JS所有封装,只是有选择的封装
  • (4)可以处理HTML/JSP/XML、CSS、DOM、事件、实现动画效果,也能提供异步AJAX功能
  • (5)文档手册很全,很详细
  • (6)成熟的插件可供选择
  • (7)提倡对主要的html标签提供一个id属性,但不是必须的
  • (8)出错后,有必定的提示信息
  • (9)不用再在html里面经过

回顾JavaScript

JavaScript定位到HTML的控件有三种基本的方式:数组

  • (A)经过ID属性:document.getElementById()
  • (B)经过NAME属性:document.getElementsByName()
  • (C)经过标签名:document.getElementsByTagName()

咱们发现,JavaScript的方法名太长了,不易于书写代码……浏览器

封装优化

这些方法名太长了,获取ID属性、NAME属性、标签名属性的控件也用不着三个方法,咱们定义下规则就行了markdown

  • 传入的参数是#号开头的字符串,那么就是id属性
  • 传入的参数是没有#号开头的字符串,也没有前缀修饰的字符串就是标签名属性

到这里,咱们就能够根据传入的参数判断它是获取ID属性的控件仍是标签名的控件了。在内部仍是调用document.getElementById()这些方法。咱们真正在使用的时候直接写上咱们自定义规则的字符串就能够获取对应的控件了。less

<script type="text/javascript"> //$()表示定位指定的标签 function $(str){ //获取str变量的类型 var type = typeof(str); //若是是string类型的话 if(type == "string"){ //截取字符串的第一个字符 var first = str.substring(0,1); //若是是#号的话 if("#" == first){ //获取#号以后的全部字符串 var end = str.substring(1,str.length); //根据id定位标签 var element = document.getElementById(end); //若是找到了 if(element != null){ //返回标签 return element; }else{ alert("查无此标签"); } }else{ } }else{ alert("参数必须是字符串类型"); } } </script>

JQuery对象与JavaScript对象之间的关系

  • 用JavaScript语法建立的对象叫作JavaScript对象
  • 用JQurey语法建立的对象叫作JQuery对象
    • Jquery对象只能调用Jquery对象的API
    • JavaScript对象只能调用JavaScript对象的API

这里写图片描述

JQuery对象与JavaScript对象是能够互相转化的,通常地,因为Jquery用起来更加方便,咱们都是将JavaScript对象转化成Jquery对象异步

Jquery转成JavaScript对象

在Jquery中对象都是当成是数组的。所以Jquery转成JavaScript对象语法以下:获取数组的下标,出来的结果就是JavaScript对象了。学习

  • jQuery对象[下标,从0开始]
  • jQuery对象.get(下标,从0开始)

再次重申:Jquery对象只能调用Jquery对象的API,JavaScript对象只能调用JavaScript对象的API优化


JavaScript对象转成Jquery

值得注意的是:在JavaScript脚本内,this是表明JavaScript对象的

JavaScript对象转成Jquery对象语法也很是简单:在${}内写上JavaScript对象,就变成了JQuery对象了。

  • 语法:$(js对象)—->jQuery对象

通常地,咱们习惯在Jquery对象的变量前面写上$,表示这是JQuery对象

相关文章
相关标签/搜索