1.$(document).ready(function(){});

这个函数会在浏览器加载完页面之后，尽快执行；

2.所有的JQuery函数用有个$开始表示，All jQuery functions start with a $；jQuery选择器通常选择HTML元素，然后做一些元素。

3.在使用JQuery之前，要引入JQuery库，在这样的背景下，你可以使用它们在编辑器中的animate.css图书馆，下面是通过“type”属性操作元素：

例如： $("button").addClass("animated bounce");     //选择button标签元素，调用animated库中的CSS，使其跳动起来；

4.JQuery也可以通过$(".Classname").addClass("   ");    来操作同一类的元素标签，做同样的动作；

例如：$(".well").addClass("animated shake");

5.JQuery也可以通过$("#IDname").addClass("   ");    来操作一个ID名字的元素标签，做出动作；

例如： $("#target3").addClass("fadeOut");

7.我们也可以在页面加载后，执行移除Class的动作，出现动画效果，通过函数removeClass（“”）；

例如： $("button").removeClass("btn-default");

8.JQuery还提供给我们，css（）函数用了改变一个元素的css样式，在页面加载后，产生动画效果；

例如：$("#target1").css("color","red");

9.JQuery还允许我们通过函数，改变非CSS属性的HTML标签的属性，函数.prop()。prop()允许您调整元素的性质。

例如：$("#target1").prop("disabled",true);

10.JQuery允许使用函数.html()，这个函数可以添加HTML标签；

例如：$("#target4").html("<em>#target4</em>");     //这样就在ID=target4的元素上，改变了他的text的内容以及属性

11.JQuery库的remove（）函数可以，移除一个HTML标签的所有内容，包括标签本身：

例如：$("#target4").remove();

12.JQuery库有一个函数，叫做appendto()，允许你选择HTML元素并将它们附加到另一个元素。

例如：$("#target2").appendTo("#right-well");

13.JQuery库允许，除了移动元素外，你也可以将它们从一个地方复制到另一个地方。通过函数clone（），可以把元素从一个地方复制到另一个地方

例如：$("#target2").clone().appendTo("#right-well");          //这里涉及两个函数的连用，把两个jQuery功能结合在一起，这就是所谓的功能连接

14.每个HTML元素都有，从它的父元素继承的属性。也就是说，包含在<div class=""container-fluid>中的标签元素，继承了class=“container-fluid”的样式；

jQuery库，有一个功能叫做parent()允许你访问，仅仅是上一层的父元素，的任何一个你选择的元素。

例如： $("#target1").parent().css("background","red");           //这里就是让ID=“target1”的元素的，仅仅是上一层父元素，的背景变为红色

15.当然有通过子元素来操作父元素的函数，就有通过父元素来操作子元素的函数。那就是.children()函数

例如：$("#right-well").children().css("color","orange");

16.JQuery库允许，你通过函数nth-child(n)，目标：nth-child（n）的CSS选择器允许你选择所有父元素中的第n个元素，同时做出同样的动作。

例如： $(".target:nth-child(2)").addClass("animated bounce");   //这里就是让所有的target类中的第二个元素，同时跳动

17.JQuery库中，可以使用even表示偶数，odd表示奇数，所以在操作相应元素时，也可以指定父元素中所有的偶元素或者所有的奇数元素：

例如： $(".target:even").addClass("animated shake");    //这里就是控制所有的偶数元素一起颤抖

18.当然JQuery库中用$表示的HTML元素可以是任何，包括<body>，我们可以操作这个页面，使用同一个炫酷的效果；

例如： $("body").addClass("animated fadeOut");   //这个效果是使页面，整体消失，渐渐的

$("body").addClass("animated hinge");       //这个效果是使页面，挂起，然后掉落的感觉，It’s amazing!

2016.8.16 JQuery学习记录的更多相关文章

  1. jquery学习记录

    1.选择器实例 语法 描述 $(this) 当前 HTML 元素 $("p") 所有 <p> 元素 $("p.intro") 所有 class=&q ...

  2. jQuery学习记录1

    jquery 和 js css里面都是坑呀 this.style.backgroundColor 和 css {background:#8df;} 是冲突的,用了前者,再$(this).addClas ...

  3. jQuery Moblile Demos学习记录Theming、Button、Icons图标，脑子真的不好使。

    jQuery Moblile Demos学习记录Theming.Button.Icons图标,脑子真的不好使. 06. 二 / Jquery Mobile 前端 / 没有评论   本文来源于www.i ...

  4. jQuery Moblile Demos学习记录Panel

    jQuery Moblile Demos学习记录Panel 11. 二 / Jquery Mobile / 没有评论   本文来源于www.ifyao.com禁止转载!www.ifyao.com 我就 ...

  5. 16 | “order by”是怎么工作的？ 学习记录

    <MySQL实战45讲>16 | “order by”是怎么工作的? 学习记录http://naotu.baidu.com/file/0be0e0acdf751def1c0ce66215e ...

  6. 【jQuery】精细学习记录

    [jQuery]精细学习记录 基础 基本语法: $(选择器).action(回调函数); $/jQuery //jQuery核心函数 $(选择器) //获得的jQuery对象 jQuery核心 - j ...

  7. Python学习记录day5

    title: Python学习记录day5 tags: python author: Chinge Yang date: 2016-11-26 --- 1.多层装饰器 多层装饰器的原理是,装饰器装饰函 ...

  8. mysql查询练习题-2016.12.16

    >>>>>>>>>> 练习时间:2016.12.16 编辑时间:2016-12-20-->22:12:08 题: 涉及:多表查询.ex ...

  9. Python学习记录day6

    title: Python学习记录day6 tags: python author: Chinge Yang date: 2016-12-03 --- Python学习记录day6 @(学习)[pyt ...

随机推荐

  1. oracle触发器加条件判断

    oracle触发器加条件判断,如果某个字段,isnode=0,那么不执行下面的方法,数据如下: create or replace trigger tr_basestation_insert_emp ...

  2. JavaScript高级程序设计学习笔记--变量、作用域和内存问题

    传递参数 function setName(obj){ obj.name="Nicholas"; obj=new object(); obj.name="Greg&quo ...

  3. 检索COM 类工厂中 CLSID 为 {} 的组件时失败

  4. 51nod 1449 砝码称重(贪心算法)

    题目:传送门. 题意:中文题. 题解:左物右码,w进制.m%w==0||m%w==1||m%w==w-1都是可以的,否则是NO. #include <iostream> #include ...

  5. 整合Struts2、Hibernate、Spring

    将项目中的对象和对象之间的管理,纳入spring容器,由spring管理 1 实现spring+hibernate集成 1.1 新建web项目 建立项目的包结构(package) 1.2加入jar包 ...

  6. 苹果的软件/系统盘 网站 http://www.panduoduo.net/u/bd-369186934/2

    http://www.panduoduo.net/u/bd-369186934/2

  7. August 7th 2016, Week 33rd Sunday

    Knowing yourself is the height of wisdom. 了解自己就是大智慧. Two-day holiday, even I didn't have enought tim ...

  8. Mysql游标

    14.6.6.1 Cursor CLOSE Syntax 14.6.6.2 Cursor DECLARE Syntax 14.6.6.3 Cursor FETCH Syntax 14.6.6.4 Cu ...

  9. CodeForces 282C（位运算）

    C. XOR and OR time limit per test 2 seconds memory limit per test 256 megabytes input standard input ...

  10. Jmeter 中通过（_time函数）获取10位时间戳的方法

    meter的__time函数作用是取当前时间的时间戳,默认取的时间精确到了毫秒级别,所以获取的时间戳默认是13位的.  下图为取10位的时间戳的函数表达式(时间精确到秒)