• 初识Jquery


    JQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。

    jQuery设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,

    提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。

    快速获取文档元素
    jQuery的选择机制构建于Css的选择器,它提供了快速查询DOM文档中元素的能力,而且大大强化了JavaScript中获取页面元素的方式。
    提供漂亮的页面动态效果
    jQuery中内置了一系列的动画效果,可以开发出非常漂亮的网页,许多网站都使用jQuery的内置的效果,比如淡入淡出、元素移除等动态特效。
    创建AJAX无刷新网页
    AJAX是异步的JavaScript和ML的简称,可以开发出非常灵敏无刷新的网页,特别是开发服务器端网页时,比如PHP网站,需要往返地与服务器通信,如果不使用AJAX,每次数据更新不得不重新刷新网页,而使用AJAX特效后,可以对页面进行局部刷新,提供动态的效果。
    提供对JavaScript语言的增强
    jQuery提供了对基本JavaScript结构的增强,比如元素迭代和数组处理等操作。
    增强的事件处理
    jQuery提供了各种页面事件,它可以避免程序员在HTML中添加太事件处理代码,最重要的是,它的事件处理器消除了各种浏览器兼容性问题。
    更改网页内容
    jQuery可以修改网页中的内容,比如更改网页的文本、插入或者翻转网页图像,jQuery简化了原本使用JavaScript代码需要处理的方式。
     

    css()

    注:css()方法不仅能获取行内样式,也能获取非行内样式

    css()                                      

    方法的参数有几种设置方法,

    css(name)                              

    获取某个元素的行内样式

    css([name1,name2,name3])    

    获取多个样式,返回值是一个数组;

    css('name',value)                    

    设置行内样式

    css({

         name1:value1,

         name2:value2

    })                                        

    设置多个行内样式

    addClass( )方法

    addClass(class) 给元素添加一个class

    addClass( class1 class2 class3 )给元素添加多个class

    removeClass(class)  给元素删除一个class

    removeClass(class1 class2 class3)给元素删除多个class

    toggleClass(class) 如果元素没有当前class那么添加,如果有那么删除

    css方法

    width()

    height()

    innerWidth() 包含内边距(padding)

    outerWidth()包含内边距和边框(padding border)

    offset()  获取某个元素相对于浏览器窗口(可视区域的距离)

    position()获取某个元素相对于父元素的偏移距离

    scrollTop()获取垂直滚动条的值;

    scrollTop(value)设置垂直滚动条的值;

    scrollLeft()获取水平滚动条的值;

    scrollLeft(value)设置水平滚动条的值;

  • 相关阅读:
    实战 | 使用maven 轻松重构项目
    分布式架构高可用与高并发那些在工作中常用到的那些变态应用
    操作系统的那些灵魂概念,你弄懂了几个?
    应该没人比我更细了吧:带你深入剖析Redis分布式锁!
    我把 Spring Cloud 给拆了!带你详细了解各组件原理!
    深入浅出MySQL灵魂十连问,你真的有把握吗?
    领统Java并发半壁江山的AQS你真的懂了吗?
    不会数据结构?24张图让你彻底弄懂它,还不会你来打我!
    你了解Spring事务传播行为吗?多个方法之间调用事务如何传播?
    深入学习:三分钟快速教会你编写线程安全代码!
  • 原文地址:https://www.cnblogs.com/chuliuxiang/p/11010475.html
Copyright © 2020-2023  润新知