JQuery学习之操作CSS
样式表:
.important{
font-weight:bold;
font-size:xx-large;
}
.blue{
color:blue;
}
1.addClass():向被选元素添加一个或多个类
$("button").click(function{
$("h1,h2,p").addClass("blue");
$("div").addClass("important");
});
可以在addClass()方法中规定多个类:
$("button").click(function(){
$("#div1").addClass("important blue");
});
2.removeClass():从被选元素删除一个或多个类
$("button").click(function(){
$("h1,h2,p").removeClass("blue");
});
3.toggleClass():对被选元素进行添加/删除类的操作
$("button").click(function(){
$("h1,h2,p").toggleClass("blue");
});
4.css():设置或返回被选元素的一个或多个样式属性
**返回首个匹配元素的background-color值:
$("p").css("background-color");
语法:css("propertyname");
**为所有匹配元素设置background-color值:
$("p").css("background-color","yellow");
语法:css("propertyname","value");
**设置多个CSS属性:
$("p").css({"background-color":"yellow","font-size":"200%"});
语法:css({"propertyname":"value","propertyname":"value",....});
JQuery学习之操作CSS的更多相关文章
- jquery学习--属性操作
学习jquery很长一段时间了,知道对属性操作的方式为: $("#xx1").attr("xx2"); //获取属性值 $("#xx1"). ...
- JQuery学习笔记【CSS选择符】--02
Jquery的程序入口: <html> <head> <title></title> <script type="text/javasc ...
- JQuery学习之操作DOM
1.DOM,就是Document Object Model(文档对象模型) 2.获得内容的方法: **text():设置或返回所选元素的文本内容 $("#btn1").click( ...
- 第二十五篇 jQuery 学习7 获取并设置 CSS 类
jQuery 学习7 获取并设置 CSS 类 jQuery动态控制页面,那么什么是动态呢?我们就说一下静态,静态几乎又纯html+css完成,就是刷新页面之后,不会再出现什么变动,一个实打实的静态 ...
- jquery 学习(五) - CSS 操作
HTML + CSS 样式 /*CSS样式*/<style> body{ margin: 0; } div{ width: 100%; height: 2000px; background ...
- jQuery 操作 CSS
jQuery 拥有若干进行 CSS 操作的方法.我们将学习下面这些: addClass() - 向被选元素添加一个或多个类 removeClass() - 从被选元素删除一个或多个类 toggleCl ...
- jQuery基础DOM和CSS操作
$('#box').html();//获取 html 内容$('#box').text();//获取文本内容,会自动清理 html 标签$('#box').html('<em>www.li ...
- JQuery:JQuery操作CSS类
JQuery:CSS类jQuery - 获取并设置 CSS 类,通过 jQuery,可以很容易地对 CSS 元素进行操作.jQuery 操作 CSSjQuery 拥有若干进行 CSS 操作的方法.我们 ...
- jQuery学习之------元素样式的操作
jQuery学习之------元素样式的操作 一..addClass( className )方法----增加样式 1.addClass( className ) : 为每个匹配元素所要增加的一个或多 ...
随机推荐
- codeforces Educational Codeforces Round 5 A. Comparing Two Long Integers
题目链接:http://codeforces.com/problemset/problem/616/A 题目意思:顾名思义,就是比较两个长度不超过 1e6 的字符串的大小 模拟即可.提供两个版本,数组 ...
- 我刚知道的WAP app中meta的属性(转载)
之前我一直做的都是WEB前端开发,来北京以后面试了一个移动前端开发,WAP前端开发. 其实在原来公司的时候也做过这方面的开发,可面试的时候面试官问我,要想强制让文档与设备的宽度保持1:1,mate标签 ...
- EF查询视图只得到一条记录
1.出错结果:数据库表视图有多条数据,在使用EF框架进行查询时却只得到一条数据(注:拦截EF得到的sql语句在数据库进行查询并没有任务问题). 2.出错原因:该视图中没有ID或者主键,EF查询时进行反 ...
- 【linux】linux下动态库so文件的一些认识
来源:http://mypyg.iteye.com/blog/845915 so其实就是shared object的意思.今天看了上面的博客,感觉好吃力.赶紧做个笔记记录一下.下面的内容大多都是连接中 ...
- JS调用自定义弹窗【bootstrap】
function commonConfirm(msg,call){ showConfirmBox("消息提示",msg,call); } $(document).on('click ...
- 词频统计_输入到文件_update
/* 输入文件见337.in.txt 输出文件见338.out.txt */ #include <iostream> #include <cctype> #include &l ...
- NYOJ题目112指数运算
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAs0AAAIICAIAAAAaCETRAAAgAElEQVR4nO3drW7jWtwv4PcmwnMhxb ...
- NYOJ题目457大小写互换
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAsUAAAIUCAIAAAB9y8bFAAAgAElEQVR4nO3dPW7bTNsG0G8T7r0Qt/
- iOS,Objective-C,相册功能的实现。
#import "ViewController.h" #define kuan [UIScreen mainScreen].bounds.size.width #define ga ...
- Java的位运算符详解实例——与(&)、非(~)、或(|)、异或(^)
位运算符主要针对二进制,它包括了:“与”.“非”.“或”.“异或”.从表面上看似乎有点像逻辑运算符,但逻辑运算符是针对两个关系运算符来进行逻辑运算,而位运算符主要针对两个二进制数的位进行逻辑运算.下面 ...