博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
你不知道的css中的expression
阅读量:4481 次
发布时间:2019-06-08

本文共 1469 字,大约阅读时间需要 4 分钟。

expression是在IE5版本之后支持使用的,用来把CSS属性和Javascript脚本关联起来,【这里的CSS属性可以是元素固有的属性,也可以是自定义属性。】是动态设置CSS属性的强大方法,但也存在着一定的危险性。 

CSS属性后面可以是一段Javascript表达式,CSS属性的值等于Javascript表达式计算的结果。

在表达式中可以直接引用元素自身的属性和方法,也可以使用其他浏览器对象。这个表达式就好像是在这个元素的一个成员函数中一样。

1,给元素固有属性赋值

 

1 #div{2 position:absolute;3 left:expression(document.body.offsetWidth-200+"px");  4 top:expression(document.body.offsetHeight-250+"px");  5 }

 

给一个div设置其左边距和上边距。document.body.offsetWidth是当前网页可见区域宽度。

2、给元素自定义属性赋值

用CSS自定义属性Expression对表格行间隔背景批量定义

 

1  2  3  4  7  8  9 
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
 
 
 
 
 
 
 
 
 
38 39

 上面的代码可以实现表格行背景色(#F8F8F8,#EFEFEF)交替出现,不需要每行单独定义。

bg是自己任意定义的属性。在自定义属性与expression之间可别忘了还有一个引号,因为实质还是CSS,所以放在style标签内,而非script内。

注意:

不是非常需要,一般不建议使用expression,因为expression对浏览器资源要求比较高

CSS Expression的问题就在于它的计算频率要比想象的多出很多。不仅仅是在页面显示和缩放时,就是在页面滚动、乃至移动鼠标时都会要重新计算一次。给CSS Expression增加一个计数器可以跟踪表达式的计算频率。在页面中随便移动鼠标都可以轻松达到10000次以上的计算量。

性能优化:

一个减少CSS Expression计算次数的方法就是使用一次性的表达式,它在第一次运行时将结果赋给指定的样式属性,并用这个属性来代替CSS Expression。

CSS Expression还是有很多问题,所以尽量不要使用。

 

转载于:https://www.cnblogs.com/hsprout/p/5041241.html

你可能感兴趣的文章
范围(地址转换)
查看>>
Unity3D游戏,TCP,WEBCOSKT,HTTP通信架构 weaving-socket
查看>>
【小程序入门集锦】19,微信小程序个人帐号申请
查看>>
php写一个简单的计算器
查看>>
【JAVA零基础入门系列】Day3 Java基本数据类型
查看>>
两个整数,求他们的最小公倍数和最大公约数
查看>>
Mongo索引
查看>>
php 实现设计模式之 建造者模式
查看>>
An Easy C Program Problem
查看>>
Replace Nested Conditional with Guard Clauses(用卫语句代替嵌套循环)
查看>>
jsp中${}是EL表达式的常规表示方式
查看>>
GoldenGate常见问题及处理
查看>>
Android JNI学习(五)——Demo演示
查看>>
SSRS 呈现Barcode Free
查看>>
java快速排序引起的StackOverflowError异常
查看>>
泛函编程(35)-泛函Stream IO:IO处理过程-IO Process
查看>>
-XX:-PrintClassHistogram 按下Ctrl+Break后,打印类的信息
查看>>
mac 安装php redis扩展
查看>>
css3中Animation
查看>>
JS 判断是否是手机端并跳转操作
查看>>