1、什么是jQuery
jquery 全称 javaScript Query.是js的一个框架。本质上仍然是js。
2、jQuery的特点
支持各种主流的浏览器。
使用特别简单
拥有便捷的插件扩展机制和丰富的插件
3、使用jquery
引入jQuery文件
jQuery的封装原理
jQuery的选择器
jQuery操作元素的属性
jQuery操作元素的样式和内容
jQuery操作元素的文档结构
jQuery中的事件
jQuery中的动画效果。

//闭包原理:在全局区中不能够获取函数体内的数据。使用更大作用域的变量来记录小作用域变量的值。

jquery的选择器学习:
基本选择器
id选择器
标签选择器
类选择器
组合选择器
层级选择器
简单选择器
内容选择器
可见性选择器
属性选择器
子元素选择器
表单选择器

注意:
jQuery中选择器获取的是存储了HTML元素对象的数组。
jquery获取的元素对象不能够直接使用js的内容,按照数组的取出方式将对象取出后可以使用js的内容。
jquery对我们提供了多种多样的选择器来选择需要操作的HTML元素对象。

jQuery操作元素属性:
获取:
对象名.attr("属性名") //返回当前属性值
注意此种方式不能获取value属性的实时数据,使用对象名.val()进行获取。
修改
对象名.attr("属性名","属性值");

jquery 操作元素内容学习:
获取元素对象
1、获取
对象名.html()//返回当前对象的所有内容,包括HTML标签。
对象名.text()//返回当前对象的文本内容,不包括HTML标签
2、修改
对象名.html("新的内容")//新的内容会将原有内容覆盖,HTML标签会被解析执行
对象名.text("新的内容")//新的内容会将原有内容覆盖,HTML标签不会被解析

jquery操作元素的样式
1、使用css()
对象名.css("属性名")//返回当前属性的样式值
对象名.css("属性名","属性值")//增加、修改元素的样式
对象名.css({"样式名":"样式值","样式名":"样式值"……})//使用json传参,提升代码书写效率。
2、使用addClass()
对象名.addClass("类选则器名")//追加一个类样式
对象名.removeClass("类选择器 名")//删除一个指定的类样式

操作文档结构学习:
获取元素对象
1、内部插入
append("内容") 将指定的内容追加到对象的内部
appendTo(元素对象或者选择器) 将制定的元素对象追加到指定的对象内容
prepend() 将指定的内容追加到对象的内部的前面
prependTo() 将制定的元素对象追加到指定的对象内容前面

2、外部插入
after 将指定的内容追加到指定的元素后面
before 将指定的内容追加到指定的元素前面
insertAfter 把所有匹配的元素插入到另一个、指定的元素元素集合的后面
insertBefore 把所有匹配的元素插入到另一个、指定的元素元素集合的前面。
3、包裹
4、替换
5、删除
empty()

jQuery动态操作事件
元素对象.bind("事件名",fn)//动态的给指定的元素对象追加指定的事件及其监听的函数。
注意:
js中的是一次添加,多次添加时覆盖的效果
jQuery是追加的效果,可以实现给一个事件添加不同的监听函数。
元素对象.unBind("事件名")//移除指定的元素对象的指定事件
注意:js方式添加的事件不能移除。
元素对象.one("事件名",fn)//给指定的元素对象添加一次性事件,事件被触发执行一次即失效。
注意:可以给事件添加多个一次函数,unBind可以用来解绑
页面载入事件
$(document).ready(fn);
页面载入成功后会调用传入的函数对象
注意:
此方式可以给页面载入动态的增加多个函数对象,不会被覆盖。

jquery学习:的更多相关文章

  1. jQuery学习之路(1)-选择器

    ▓▓▓▓▓▓ 大致介绍 终于开始了我的jQuery学习之路!感觉不能再拖了,要边学习原生JavaScript边学习jQuery jQuery是什么? jQuery是一个快速.简洁的JavaScript ...

  2. jquery学习(一)

    简单的jquery学习,首先在页面引入jquery <!-- 引入jquery --> <script src="js/jquery-1.8.3.js" type ...

  3. jQuery学习笔记(一)jQuery选择器

    目录 jQuery选择器的优点 基本选择器 层次选择器 过滤选择器 表单选择器 第一次写博客,希望自己能够长期坚持,以写博客的方式作为总结与复习. 最近一段时间开始学习jQuery,通过写一个jQue ...

  4. jQuery 学习笔记

    jQuery 学习笔记   一.jQuery概述    宗旨: Write Less, Do More.    基础知识:        1.符号$代替document.getElementById( ...

  5. jQuery学习笔记(一):入门

      jQuery学习笔记(一):入门 一.JQuery是什么 JQuery是什么?始终是萦绕在我心中的一个问题: 借鉴网上同学们的总结,可以从以下几个方面观察. 不使用JQuery时获取DOM文本的操 ...

  6. jQuery学习笔记 - 基础知识扫盲入门篇

    jQuery学习笔记 - 基础知识扫盲入门篇 2013-06-16 18:42 by 全新时代, 11 阅读, 0 评论, 收藏, 编辑 1.为什么要使用jQuery? 提供了强大的功能函数解决浏览器 ...

  7. 很不错的jQuery学习资料和实例

    这些都是学习Jquery很不错的资料,整理了一下,分享给大家. 希望能对大家的学习有帮助. 帕兰 Noupe带来的51个最佳jQuery教程和实例, 向大家介绍了jQuery的一些基本概念和使用的相关 ...

  8. jquery学习以及下载链接

    jquery学习链接 http://www.w3school.com.cn/jquery/jquery_intro.asp jquery 脚本库下载链接 http://jquery.com/downl ...

  9. 转载最佳JQuery学习网站

    转载文章,原出处: http://www.gbin1.com/technology/jquery/learningjquerywebsites/ jQuery是目前最流行的 JavaScript    ...

  10. JQuery学习笔记--01

    JQuery使用的话,必做的一下件事就是下载JQuery库,才可以使用下载地址:http://jquery.com/ 下面就是引用JQuery库了: <script type="tex ...

随机推荐

  1. ceph 开启mgr balancer

    参考链接: mgr balancer模式探索及配置方法1 mgr balancer模式探索及配置方法2 1.ceph mgr module enable balancer [root@controll ...

  2. 算法-deque双端队列

    Python的deque模块,它是collections库的一部分.deque实现了双端队列,意味着你可以从队列的两端加入和删除元素 1.基本介绍 # 实例化一个deque对象d = deque()d ...

  3. CentOS 7/8上部署Ceph

    Ceph是一个分布式的存储系统,可以在统一的系统中提供唯一的对象.块和文件存储,Ceph的大致组件如下: 1. Ceph监视器(ceph-mon):用来维护集群状态的映射,包括监视器映射,管理器映射, ...

  4. 创建human用户登录数据库创建表

    根据人力资源管理系统中表的设计,创建human用户登录数据库创建 准备阶段 把运行脚本复制到D:\app\Administrator\product\11.2.0\dbhome_1\demo\sche ...

  5. oracle备份之备份测试脚本(冷备、热备、rman)

    1.数据库环境 数据库DBID及打开模式SQL> select dbid,open_mode from v$database; DBID OPEN_MODE---------- -------- ...

  6. 【Android】Scrollview返回顶部,快速返回顶部的功能实现,详解代码。

    作者:程序员小冰,GitHub主页:https://github.com/QQ986945193 新浪微博:http://weibo.com/mcxiaobing 首先给大家看一下我们今天这个最终实现 ...

  7. Android Studio出现:Your project path contains non-ASCII 错误代码解决方法

    导入Project的出现: Error:(1, 0) Your project path contains non-ASCII characters. This will most likely ca ...

  8. Linux常用命令--不断更新

    Linux命令: !. 1.[root@loc8lhost/root]# 表示登陆进去系统,其中#是超级⽤用户也即root⽤用 户的系统提示符 #. 2.reboot命令可以重启系统 $. 3.关闭系 ...

  9. Bitmap转ImageSource

    bitmap to bytes Bitmap b = new Bitmap( "test.bmp "); MemoryStream ms = new MemoryStream(); ...

  10. SpringBoot系列之从入门到精通系列教程

    对应SpringBoot系列博客专栏,例子代码,本博客不定时更新 Spring框架:作为JavaEE框架领域的一款重要的开源框架,在企业应用开发中有着很重要的作用,同时Spring框架及其子框架很多, ...