addclass和css()的区别
转载自:https://www.yuanmas.com/info/9ezZE31O67.html
对于样式的设置,addClass与css方法两者之间有什么区别?
可维护性:
.addClass()的本质是通过定义个class类的样式规则,给元素添加一个或多个类。css方法是通过JavaScript大量代码进行改变元素的样式
通过.addClass()我们可以批量的给相同的元素设置统一规则,变动起来比较方便,可以统一修改删除。如果通过.css()方法就需要指定每一个元素是一一的修改,日后维护也要一一的修改,比较麻烦
灵活性:
通过.css()方式可以很容易动态的去改变一个样式的属性,不需要在去繁琐的定义个class类的规则。一般来说在不确定开始布局规则,通过动态生成的HTML代码结构中,都是通过.css()方法处理的
样式值:
.addClass()本质只是针对class的类的增加删除,不能获取到指定样式的属性的值,.css()可以获取到指定的样式值。
样式的优先级:
css的样式是有优先级的,当外部样式、内部样式和内联样式同一样式规则同时应用于同一个元素的时候,优先级如下
外部样式 < 内部样式 < 内联样式
- .addClass()方法是通过增加class名的方式,那么这个样式是在外部文件或者内部样式中先定义好的,等到需要的时候在附加到元素上
- 通过.css()方法处理的是内联样式,直接通过元素的style属性附加到元素上的
通过.css方法设置的样式属性优先级要高于.addClass方法
总结:
.addClass与.css方法各有利弊,一般是静态的结构,都确定了布局的规则,可以用addClass的方法,增加统一的类规则 如果是动态的HTML结构,在不确定规则,或者经常变化的情况下,一般多考虑.css()方式
addclass和css()的区别相关推荐
- JQuery中.css()与.addClass()设置样式的区别
对于样式的设置,我们学了addClass与css方法,那么两者之间有什么区别? 可维护性: .addClass()的本质是通过定义个class类的样式规则,给元素添加一个或多个类.css方法是通过Ja ...
- CSS HACK 区别 IE6、IE7、IE8、Firefox兼容性
转载链接:http://developer.51cto.com/art/201009/226787_1.htm 本文向大家描述一下如何使用CSS HACK区别IE6.IE7.IE8.Firefox兼容 ...
- readonly与disabled属性在css中区别
论readonly与disabled在css中区别 之前在项目中遇到的一个问题,现在想把它记录下来. 当项目需求上需要在文本框中禁用输入某个值的时候,我第一个反应是用了disabled,因为之前一直接 ...
- scss、sass 和 css 的区别
项目中,会经常使用诸如scss.sass的style样式,它们和css有什么区别呢? less大家应该都不陌生,同样的scss.sass一样,它们都可以称为:CSS预处理器语言. 简单来说,scss和 ...
- 外观html与外观css的区别,用房间和装修来解读html代码与css样式的区别和关系
想要了解html与css的区别和关系,就必须要知道这2个东西的特点和主要用途用法等.html语言是一种超文本标记语言,通过html语言中的各种标签(如table.p.div等),可以设计出很多不同结构 ...
- 微信小程序 WXSS和CSS的区别?什么是WXSS?
1.什么是WXSS wxss全名是WeiXin Style Sheets 是一套样式语言,用于描述WXML的组件样式,类似于网页开发中的CSS.本质上和css没区别,只是在css基础上创新了一些参数, ...
- js和html以及css的区别,html、css、js中的区别与关系
html.css.js中的区别与关系 2020/04/26 作者: 互盟股份 今天小盟给大家分享的是html.css.js中的区别与关系,相信很多人都不太了解,为了让大家更加了解html.css.js ...
- html em px的不同,CSS:区别 px、em、rem
区别px 在缩放页面时无法调整那些使用它作为单位的字体.按钮等的大小: em 的值并不是固定的,会继承父级元素的字体大小,代表倍数: rem 的值并不是固定的,始终是基于根元素 的,也代表倍数. em ...
- vb.net 打开ie 传参数_FF与IE对javascript和CSS的区别?
1. document.formName.item("itemName") 问题 说明:IE下,可以使用document.formName.item("itemName& ...
- 导入式样式表CSS与链接式样式表CSS的区别
<!-- 链接外部样式:也就是在与<head>与</head>标记之间加入一个<link>标记. --> <head> <link h ...
最新文章
- 单分子测序技术取得重要突破
- Sci-Hub重生了,这回用上了分布式网络
- Python爬虫(一)
- mariadb 10.1查看per connection内存消耗
- 给自己的Unity添加声音文件
- 剑指offer 二进制中1的个数
- 机器学习实战-第12章Fpgrowth代码勘误+递归打印效果分析
- 数据异常HTML,@ Html.DropDownListFor的数据绑定异常
- Ergo生态:首个算法稳定币SigmaUSD正式启动
- 解决firefox和IE9对icon font字体的跨域访问问题
- [转]asp 没有权限: 'CreateObject'的解决方法
- C语言指令启动mcs51计时器是,单片机原理及应用-中国大学mooc-题库零氪
- 真惭愧--连这样的小事都没有坚持下来
- thinkphp 分页样式
- EXCEL按内容引用其他表数据
- 独立站的免费流量玩法
- 阿里云ecs实例怎么增添到IP白名单和安全组?
- 爬虫日记之07正则表达式(手把手教你区分贪婪匹配和惰性匹配)
- H.265网页播放器EasyPlayer实现WebRTC视频实时录像功能
- html 实现动态在线预览word、excel、pdf等文件,先收藏留着以后用