如何修改网站内容(常用的jquery控制css样式的方法做一个小结..)

　　如何修改网站内容(常用的jquery控制css样式的方法做一个小结..)

　　本文主要讲解“如何在jquery中动态修改css样式”，感兴趣的朋友不妨看看。本文介绍的方法简单、快速、实用。让小编带你学习《如何在jquery中动态修改css样式》！

　　用jquery动态修改css样式的方法：1、通过css方法动态修改css样式；2、 为指定的html元素分配一个CSS样式；3、 查看元素的css样式；4、隐藏和显示指定的 p 或其他 html 元素。

　　jQuery 实现了一种动态改变 CSS 样式的方法。

　　详情如下：

　　jQuery几乎成为了开发WEB应用程序的标准JS库，这与其简单易用是分不开的。作为后端开发者，在做一些前端页面的时候，CSS样式的把控是少不了的。如果是静态CSS，当然可以直接写，但是有些界面需要一些动态效果，比如颜色变化，字体大小变化，甚至现实中p的隐藏等等，都需要用到javascript要动态控制其CSS样式，下面总结一下jquery控制css样式的常用方法。

　　1. 改变超链接的样式

　　2. 为指定的 html 元素赋予指定的 CSS 样式

　　3. 查看元素的CSS样式

　　4. 隐藏和显示 p 或其他指定的 html 元素

　　一、改变超链接的样式

　　$("#mylink a").css('color','#111111');

//这里选择器‘$("#mylink a")'表示ID为'#mylink'的元素下的所有链接。

//.css(‘color','#111111');表示把颜色设为'#111111'

　　二、 将定义好的 CSS 样式分配给指定的 html 元素

　　1. 您可以在外部 css 文件中创建 css 样式，例如

　　.mystyle{width:200px;height:100px;}

　　然后用jquery分配它

　　$("#result").css(mystyle);

　　2. 可以定义一个css对象（即javascript对象），然后赋值

　　var pcss = {

 background: '#EEE',

   width: '478px',

   margin: '10px 0 0',

   padding: '5px 10px',

   border: '1px solid #CCC'

};

$("#result").css(pcss);

　　这种方式与外链方式类似，个人推荐外链方式。

　　三、查看元素的 CSS 样式

　　var mycolor=$("#mylink a").css("color");

if ($('#myp').css('display')=="none"){...}

//和第一个例子相似，但是这里我们只传递一个参数(样式属性)

　　四、隐藏显示 p 或其他元素

　　1.直接修改CSS方法

　　$('#myp').attr('style','display:none;');//隐藏

$('#myp').attr('style','display:block;');//显示

　　至此，相信大家对“如何在jquery中动态修改CSS样式”有了更深入的了解，那就来试试吧！这里是易速云网站，更多相关内容可在相关频道查询，关注我们，继续学习！