上一章我们知道了,使用 $().attr('style')
的方法可以操作行内样式表。但是这种方法,让人觉得泯然大众矣,有点对不起我们神奇的 CSS。
其实就是 CSS 是个比较复杂的属性,我们得给它弄个专属的方法,这样好用、稳定、效率高。
但是,我脑仁小啊,记不住啊,幸好 jQuery 很简单,操作 CSS 就用 css
方法就行了(多好记。
差不多和 attr
一样的用法,不过已经是针对 CSS 了,所以后面小括号里要说清楚的是哪一条 CSS 属性。
const font_color = $('#miao').css('color');$('#miao').css('color', 'red');
获取到的值是最终应用在这个元素上的样式,也就是不管外部样式表、内部样式表、内联样式表……反正获取的是计算后的最终结果。
但是设置,就只是内联样式表,行内样式表,嵌入式……反正就是在元素标签里写 style
属性那种,我居然在网上看到好多种名字了。
因为这样优先级高,一般都可以稳定起作用,又不用我们去写,去读,乱不乱的就完全不管了。
不过相比于 HTML 元素中的属性,CSS 属性就很多很热闹了,这样单独的设置,明显不能满足我们的需求,一条属性写一句什么的,我懒啊!
CSS 的写法很类似我们学过的对象,无论是书写格式,还是内容,结构……其实就是一个对象了啦,只是每条数据后面用的是分号,换成逗号就彻底一样了。
所以我们可以给某个元素直接塞一个对象,来实现批量设置:
$('#miao').css({'color': 'red', 'font-size': '16px'});
可以整理一下格式,方便阅读:
$('#miao').css({'color': 'red','font-size': '16px'});
小括号里放了一个对象,像 color
这种属性名,不写引号也可以。但是 font-size
这种里面有特殊符号的,就必须写,我喜欢索性都写上(仅限这个方法中,奇怪的习惯呢~
有的同学可能觉得写引号很麻烦,就是不想写,就是不喜欢写,那也是可以的,嗯,就是这么的随和。但是减号肯定会引起误会,所以我们要把含有减号的属性名称,改为小驼峰的写法,就像:fontSize
这样。
当然一个属性也可以用对象的格式进行设置,这样记住一种用法就可以通行各种情况。我就是懒(今天说了好几遍),想少打几个字符。
至于获取,没什么批量的方法,老老实实一个属性一个属性的获取好了,不过真的有需要大量获取的情况,应该考虑一下,是不是有其他方式进行变通。
很重要的一个方法,这么快讲完了,篇幅都不够,算了,不凑了,今天懒……
暂无评论内容