//1、获取和设置样式

$("#tow").attr("class")获取ID为tow的class属性

$("#two").attr("class","divClass")设置Id为two的class属性。

//2、追加样式

$("#two").addClass("divClass2")为ID为two的对象追加样式divClass2

//3、移除样式

$("#two").removeClass("divClass")移除 ID为two的对象的class名为divClass的样式。

$(#two).removeClass("divClass divClass2")移除多个样式。

//4、切换类名

$("#two").toggleClass("anotherClass") //重复切换anotherClass样式

//5、判断是否含有某项样式

$("#two").hasClass("another")==$("#two").is(".another");

//6、获取css样式中的样式

$("div").css("color") 设置color属性值. $(element).css(style)

//设置单个样式

$("div").css("color","red")

//设置多个样式

$("div").css({fontSize:"30px",color:"red"})

$("div").css("height","30px")==$("div").height("30px")

$("div").css("width","30px")==$("div").height("30px")

//7.offset()方法

//它的作用是获取元素在当前视窗的相对偏移,其中返回对象包含两个属性,即top和left 。

//注意:只对可见元素有效。

var offset=$("div").offset();

var left=offset.left;         //获取左偏移

var top=offset.top;        //获取右偏移

//8、position()方法

//它的作用是获取元素相对于最近的一个position样式属性设置为relative或者absolute的祖父节点的相对偏移,与offset()一样,它返回的对象也包括两个属性即top和left。

//9、scrollTop()方法和scrollLeft()方法

$("div").scrollTop();        //获取元素的滚动条距顶端的距离。

$("div").scrollLeft();         //获取元素的滚动条距左侧的距离。

//10、jQuery中的 toggle和slideToggle 方法,都可以实现对一个元素的显示和隐藏。区别是:

//toggle:动态效果为从右至左。横向动作。

//slideToggle:动态效果从下至上。竖向动作。

//比如想实现一个树由下至上收缩的动态效果,就使用slideToggle就ok了。

$('input').attr("readonly",true)//将input元素设置为readonly
$('input').attr("readonly",false)//去除input元素的readonly属性
$('input').attr("disabled",true)//将input元素设置为disabled
$('input').attr("disabled",false)//去除input元素的disabled属性

使用jquery操作元素的css样式(获取、修改等等)的更多相关文章

  1. 转:jquery操作元素的css样式(获取、修改等等)

    //1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#two").attr(&qu ...

  2. jQuery操作元素对象的样式

    在jQuery中操作元素为了加快速度,或者书写速度,可以用到json的格式: <!DOCTYPE html> <html> <head> <meta char ...

  3. javascript操作元素的css样式

    我们经常要使用Javascript来改变页面元素的样式.当中一种办法是改变页面元素的CSS类(Class),这在传统的Javascript里,我们一般是通过处理HTML Dom的classname特性 ...

  4. 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式

    本系列文章导航 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式 一.摘要 本篇文章讲解如何使用jQuery获取和操作元素的属性和CSS样式. 其中DOM属性和元素属性的区分值得 ...

  5. jQuery入门(2)使用jQuery操作元素的属性与样式

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

  6. 使用jQuery操作元素的属性与样式

    本文学习如何使用jQuery获取和操作元素的属性和CSS样式. 元素属性和Dom属性 对于下面这样一个标签元素: <img id='img' src="1.jpg" alt= ...

  7. 《从零开始学习jQuery》:用jQuery操作元素的属性与样式

    元素属性和Dom属性简介 对于下面这样一个标签元素: <img id='img' src="1.jpg" alt='1' class="imgs"> ...

  8. jQuery操作元素的属性与样式

    本文学习如何使用jQuery获取和操作元素的属性和CSS样式. 元素属性和Dom属性 对于下面这样一个标签元素: <img id='img' src="1.jpg" alt= ...

  9. 3 、操作元素 (属性 CSS 和 文档处理)

    3   操作元素-属性 CSS 和 文档处理  3.1 属性操作 $("p").text()    $("p").html()   $(":check ...

随机推荐

  1. css3 3d正反面翻转

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. [WEB面试题] web前端面试题HTML+CSS第一弹,个人整理部分面试题汇总

    以下内容仅供参考,网络整理而来 1.XHTML和HTML是什么有什么不同的区别 HTML是一种基本的WEB网页设计语言 XHTML可扩展超文本标记语言,是一种置标语言,表现方式与超文本标记语言(HTM ...

  3. 关于session销毁的问题,invalidate() 和removeAttribute()

    request.getSession().invalidate(); 销毁当前会话域中的所有属性 request.getSession().removeAttribute("username ...

  4. sqlserver 获取数据库、表和字段相关信息

    --获取指定服务器上的所有数据库 SELECT Name FROM Master..SysDatabases ORDER BY Name --获取指定数据库下所有表 SELECT Name FROM ...

  5. css过渡笔记

    3D     http://fangyexu.com/tool-CSS3Inspector.html <!DOCTYPE html> <html lang="en" ...

  6. js面向对象设计之function类

    本文仅探讨如何合理的使用 function 在 javascript中实现一个面向对象设计的类.总所周知,javascript 并不能实现一个真正意义上的类,比如 protect 比如 函数重载.下面 ...

  7. 有用的linux指令(资料转载)

    对 Linux 新手非常有用的20个命令                                                                    你打算从Windows换 ...

  8. screen 状态为Attached 连不上

    用 screen -ls, 显式当前状态为Attached, 但当前没有用户登陆些会话.screen此时正常状态应该为(Detached)  此时用screen -r ,怎么也登不上. 最后找到解决方 ...

  9. Mac下git的环境搭建和基本使用

    前言本文将介绍git的基本概念.环境搭建.日常使用,主要针对刚接触git,或接触不久,或好久没用忘记的同学们,当然是基于mac环境的,window系统也是大同小异!本文将从以下几个模块介绍,希望能帮助 ...

  10. 【Kettle】1、简单介绍

    本人为转载,感谢作者的辛勤劳作:http://blog.csdn.net/rotkang/article/details/20810921 ------------------------------ ...