Jquery操作样式
1.CSS(name,value)
修改单个样式
$(function(){
$(".divcontent").css("background","red"); //修改背景颜色为红色
});
2.CSS({});
修改多个样式
$(function(){
$(".divcontent").css({
//边框 1像素实线 红色
border:"1px solid red",
//背景颜色绿色
background:"green"
});
});
3.Css(name);
获取样式
$(function(){
//返回rgb(0,0,0);
console.log($(".divcontent").css("background"));
});
获取已设置的样式或默认的样式,如果是给多个“li”设置的样式,则返回第一个li元素的样式
$(function(){
$("li:first").css("fontSzie","16px");
$("li").eq(1).css("fontSize","24px");
$("li").eq(2).css("fontSize","44px");
console.log($("li").css("fontSize")); //返回16px
});
隐士迭代:偷偷的for循环
设置的时候:会给JQ内部所有的对象都设置相同的值
获取的时候:只会返回第一个元素对应的值
4.class操作:
4.1添加类:addClass("类名"); //类型不需要加.
在原有的基础上添加类,不覆盖任何类
4.2移除类:removeClass("类名");
4.3判断类:hasClass("类名");
4.4切换类:toggleClass("类名");
<script>
//记住 click()里面是方法 加上function
//添加类
$("#p").click(function(){
$("ul").addClass("boot");
});
//移除类
$("input").eq(1).click(function(){
$("ul").removeClass("boot");
});
//判断类
$("input").eq(2).click(function(){
var a=$("ul").hasClass("boot");
if(a){
$("ul").removeClass("boot");
}else{
$("ul").addClass("boot");
}
}); //切换类
$("input").eq(3).click(function(){
$("ul").toggleClass("boot"); }); </script>
Jquery操作样式的更多相关文章
- 测开之路一百零四:jquery操作样式
jquery操作样式 添加样式.删除样式 切换样式 css("属性","值") css("属性","值"), 修改多个 ...
- JQuery操作样式以及JQuery事件机制
1.操作样式 1.1 css的操作 功能:设置或者修改样式,操作的是style属性 操作单个样式 // name:需要设置的样式名称 // value:对应的样式值 // $obj.c ...
- jQuery操作样式知识总结
css操作 功能:设置或者修改样式,操作的是style属性. 设置单个样式 //name:需要设置的样式名称 //value:对应的样式值 css(name, value); //使用案例 $(&qu ...
- jquery 与javascript关系 ①取元素 ②操作内容 ③操作属性 ④操作 样式 ⑤ 事件 点击变色
jQuery的min版本和原版功能是一样的,min版主要应用于已经开发成的网页中,而非min版 的文件比较大,里面有整洁的代码书写规范和注释,主要应用于脚本开发过程当中. JQuery是继protot ...
- 2016/4/1 jquery 与javascript关系 ①取元素 ②操作内容 ③操作属性 ④操作 样式 ⑤ 事件 点击变色
jQuery的min版本和原版功能是一样的,min版主要应用于已经开发成的网页中,而非min版 的文件比较大,里面有整洁的代码书写规范和注释,主要应用于脚本开发过程当中. JQuery是继protot ...
- jquery 操作
Jquery使用时要引用,引用时放在最前. Jquery: $代表选择器, $(document) ready(function(e){}):找到页面,页面加载完成后执行. JS选取元素操作内容操作属 ...
- JQuery操作DOM(8)
一.jQuery操作样式 1.设置和获取样式 /* 单个样式 */ $(selector).css(属性,值): /* 多个样式 */ $(selector).css({属性:值,属性:值}); /* ...
- 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式
本系列文章导航 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式 一.摘要 本篇文章讲解如何使用jQuery获取和操作元素的属性和CSS样式. 其中DOM属性和元素属性的区分值得 ...
- jQuery入门(2)使用jQuery操作元素的属性与样式
jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...
随机推荐
- dispatch_async 和dispatch_sync
dispatch_sync(),同步添加操作.他是等待添加进队列里面的操作完成之后再继续执行. dispatch_queue_t concurrentQueue = dispatch_queue_cr ...
- 【转】Windows Server 2016 安装 IIS 服务时提示指定备用源路径
原文地址:http://www.codingwhy.com/view/973.html 在Windows Serever 2016中安装IIS的时候,遇到以下提示 是否需要指定备用源路径?一个或多个安 ...
- AJPFX平台:中国的经济是个大泡沫吗?这个泡沫即将崩解吗?
AJPFX问:中国的经济是个大泡沫吗?这个泡沫即将崩解吗? 这一老问题,最近又一次引起世界的关注. 首先,中国在领导层变更之际,把2013年的增长目标定为7.5%,“保八”的调子不再,两位数高增长的时 ...
- mysql多列索引和最左前缀
数据库的索引可以加快查询速度,原因是索引使用特定的数据结构(B-Tree)对特定的列额外组织存放,加快存储引擎(索引是存储引擎实现)查找记录的速度.索引优化是数据库优化的最重要手段. 如果查询语句使用 ...
- vue-cli初始化一个项目
1,换成淘宝源: npm config set registry https://registry.npm.taobao.org/ 检查是否修改成功 npm config get registry 2 ...
- linux防火墙(三)—— iptables语法之匹配条件
一.iptables规则的匹配条件类型有三类 1.通用匹配:可直接使用,不依赖于其他条件或扩展,包括网络协议.IP地址.网络接口等条件 2.隐含匹配:要求以特定的协议匹配作为前提,包括端口.TCP标记 ...
- Shell - 简明Shell入门11 - 调用脚本(CallTheScript)
示例脚本及注释 主脚本: CallTheScript.sh #!/bin/bash . ./11-subscript.sh # 调用其他脚本;注意点号"."和文件路径之间有一空格; ...
- 提取PPT中的原始图片
写Word的不如做Excel 的,做Excel不如做PPT的,写代码的不如做PPT. 为了在电子邮件中上传PPT,其中的图片大都经过压缩,以便缩小PPT的体积.那么如何将PPT中的图片,还原成没有经过 ...
- Flask-Restful详解
Restful API规范 restful api是用于在前端与后台进行通信的一套规范.使用这个规范可以让前后端开发变得更加轻松.以下将讨论这套规范的一些设计细节. 协议: 采用http或者https ...
- odoo开发笔记 -- odoo web机制浅析
http://blog.csdn.net/M0relia/article/details/39025947