1 什么是jQuery?

jQuery是一个快速,小巧,功能丰富的JavaScript库

javascript库: 就是存放javascript代码的仓库

jQuery作为一个迭代多年的优秀框架,是前端js开发者的基本功.

2 为什么要学jQuery?

它使诸如HTML文档遍历和操纵,事件处理,动画和Ajax等事情变得更简单,使用易于使用的API,可在多种浏览器中使用.结合多功能性和可扩展性,jQuery改变了数百万人编写JavaScript的方式.

引用jQuery 的介绍来说: write less, do more

写js原生的一些问题:

  • 实现同一功能,代码量相对较大

  • 有兼容性问题

jQuery :

  • 实现同一功能,代码量更少

  • 处理了兼容性问题

//需求:
//点击div,改变div中的文本

//html
<div id="box">点我有惊喜</div>

//js原生
var box = document.getElementById('box');
box.addEventListener('click',function(){
    this.innerText = '惊喜';
}, false);

//jQuery
$('#box').on('click',function(){
    $(this).text('jQuery版的惊喜');
})

2 下载jQuery

官网地址:http://jquery.com

2.2 引入jQuery

3  jQuery中的$函数:入口函数,类似 js原生中的window.onload

$(function(){
    code...
})

3.1 传入一个DOM对象

作用: 将DOM对象转换成一个jQuery对象

什么是jQuery对象:jQuery库提供的对象类型,因为jQuery库功能非常强大,只有使用jQuery对象才能调用jQuery库提供的方法

//html
<div id="box">div里面的内容</div>
//js
var box = document.getElementById('box');

//用$函数,把DOM对象转换成jQuery对象
$(box).text('用jquery对象修改的文本');
//或者$('#box').text('用jquery对象修改的文本');
//js执行完毕的结果 <div id="box">用jQuery对象修改的文本</div>

jQuary总结1:jQuary的优点和地位的更多相关文章

  1. day 50 jquary 终极版本

    jQuary 一.jquary对象和dom对象 jquary找到的标签对象成为-- jquary对象 原生js找到的标签对象成为 -- dom对象 dom对象只能使用dom对象的方法,不能使用jque ...

  2. ant+eclipse知识点详解及使用案例

    ant的优点和地位就不再阐述,下面直接上知识点: 在java中使用xml文件开发,有以下基本语法 (1)project:每个ant程序有且只有一个此标签,而且是类似于html的总标签,有name,de ...

  3. JavaScript学习12.1

    JavaScript弹窗可以创建3种消息框:警告框.确认框.提示框,可以不带window对象直接使用相应的方法警告框:保护用户可以得到某些信息,当出现警告框后需要用户点击确认按钮之后才能操作windo ...

  4. Mac 下搭建 Apache 服务器

    Apache作为最流行的Web服务器端软件之一,它的优点与地位不言而喻.下面介绍下在Mac下搭建Apache服务器的步骤: (1)“前往” –>”个人” (2)在你的个人目录下新建一个文件夹,改 ...

  5. Jquery学习理解 (课堂)

    Jquary概述 3 1.Jquary简介 3 1.1什么是jquery 3 2.使用jquary 4 2.1浏览器如何解析HTML文件 4 2.2利用选择器定位节点 4 2.3调用方法操作节点 5 ...

  6. 预习 jQuary

    一.jQuary简介 1.jQuery 库 - 特性 jQuery 是一个 JavaScript 函数库. jQuery 库包含以下特性: HTML 元素选取 HTML 元素操作 CSS 操作 HTM ...

  7. jquary 单选,多选,select 获取和设置值 jquary自定义函数

    <%@ page contentType="text/html; charset=UTF-8"%> <%@ taglib prefix="c" ...

  8. jQuary学习の三の效果展示

    一.隐藏显示 1.$(selector).hide(speed,callback);2.$(selector).show(speed,callback); 可选的 speed 参数规定隐藏/显示的速度 ...

  9. jQuary学习の二の语法

    jQuery 语法是通过选取 HTML 元素,并对选取的元素执行某些操作.基础语法: $(selector).action() 美元符号定义 jQuery 选择符(selector)"查询& ...

随机推荐

  1. Spring的常用下载地址

    第一种,简单粗暴直接 1 http://repo.springsource.org/libs-release-local/org/springframework/spring/3.2.4.RELEAS ...

  2. http的含义

    HTTP是超文本传输协议,是客户端浏览器或其他程序与Web服务器之间的应用层通信协议.在Internet上的Web服务器上存放的都是 超文本信息,客户机需要通过HTTP协议传输所要访问的超文本信息.H ...

  3. 华为交换机S5700设置远程ssh telnet登录

    AAA是指:authentication(认证).authorization(授权).accounting(计费)的简称,是网络安全的一种管理机制:Authentication是本地认证/授权,aut ...

  4. ubuntu 解决“无法获得锁 /var/lib/dpkg/lock -open”的方法

      在ubuntu系统终端下,用apt-get install 安装软件的时候,如果在未完成下载的情况下将终端中断,此时 apt-get进程可能没有结束.结果,如果再次运行apt-get instal ...

  5. new及placememt new 异同点

    new与定位new 区别如下: 简单概括: new 分配的内存地址空间来自于heap堆,用完需使用delete 释放内存 定位new 使用的不是heap堆内存,因此不需要使用delete 释放 定位n ...

  6. OpenLayers 3 之 切换图层控件

    OpenLayers 3 之 切换图层控件 openlayers 3中并没有默认的图层切换控件,GitHub中有一个项目实现了我们需要的控件-------- ol3-layerswitcher . 可 ...

  7. 关于电机驱动扩展板 L293D 马达板Arduino

    注意端口3,4,5,6,7,8,9,10,11,12会被占用(板子上的pin口). 通过 MS_DCMotor motor(4); 中的4指的是4号电机,同理还有1-3号电机.不是pin口   舵机用 ...

  8. A标签的href设置为#代表什么意思?

    空锚点<a href="#abc">a link <#>表示跳到锚点abc,<a href="#">a link <# ...

  9. iOS学习之UINavigationController详解与使用(三)ToolBar

    1.显示Toolbar  在RootViewController.m的- (void)viewDidLoad方法中添加代码,这样Toobar就显示出来了. [cpp] view plaincopy [ ...

  10. 前端开发之JavaScript基础篇四

    主要内容: 1.定时器 2.正则表达式入门 3.元字符 4.正则表达式实战运用 一.定时器 javaScript里主要使用两种定时器,分别是:setInterval()和setTimeout(). 1 ...