zoukankan      html  css  js  c++  java
  • 2016.8.16 JQuery学习记录

    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!

  • 相关阅读:
    单工-半双工-双工
    为你的Windows7设置动态壁纸
    Vmware为Ubuntu安装VmTools
    CodeBlocks集成cppcheck
    自定义鼠标右键(层叠式菜单:cascading menu)
    Hao123这个流氓
    Android的ADT内容助手快捷方式设置
    安装Google框架服务并突破Google Play下载限制
    Windows7下CHM电子书打开不能正常显示内容
    谷歌首页背景设置
  • 原文地址:https://www.cnblogs.com/hqutcy/p/5775592.html
Copyright © 2011-2022 走看看