Cascading Style Sheet (css) 的Expression 属性
这个星期看了点css，发现css还有这样一个可以调用js的属性，可进行css与js的互操作（暂且这么说，^_^
）。我在网上搜索了下，大致都是两篇文章，一篇是介绍防止被frame，一篇就是单纯的描述expression的用
途，第二篇的标题好像是“CSS中的行为——expression”，介绍语法的。（两篇都被好多人转载，也找不到
出处，网上很多，就不贴了）
感觉需要注意的地方有一下几个方面：
1. 两个事件之间用逗号分隔，请注意不是分号。
比如：cc:expression(οnmοuseοver=…,οnmοuseοut=…);
2. 如果事件调用设置属性时，要采用function，可内联，可外置。
如：cc:expression(οnmοuseοver=function(){
this.style.color = "#960";
},οnmοuseοut=function(){
this.style.color = "#000";
})
3. 自定义属性可随意命名，但与expression之间要有冒号(因为这是css规则),自定义属性也就是
我示例中的cc，你可以命名为amao，agou，可以包含数字，字母，下划线，特殊字符甚至可以
是中文（我测试的可以）,但是我发现一个奇怪的现象，就是命名中使用特殊字符,那么命名的第
一个字符必须是特殊字符，并且不管是否第一个字符是特殊字符，都不能将特殊字符作为最后结
束符。(正确的命名：@_中文，#test,1,webexp,34_er 等等，错误的命名：ad$,1_&)
4. 通常情况下，expression 只能在中得到支持，在firefox及其他浏览器都不支持，但是我通过
javascript发现firefox也可以支持。原因可能就是创建了一个css属性（除了这个我也想不到啥
原因）。先看下代码：
CSS：
<style type="text/css">
.tdcss1 { BACKGROUND-COLOR: #F7F3F7; }
.tdcss2 { BACKGROUND-COLOR: #FFF7FF; }
</style>
JAVASCRIPT：
<script type="text/javascript">
function evalcls(obj)
{
obj.cellSpacing=0;
obj.cellPadding=0;
for (i=0;i<obj.rows.length;i++) {
if(i%2==0){
obj.rows[i].className = "tdcss1"
}else{
obj.rows[i].className = "tdcss2";
}
}
}
function setstyle(){
var Max = 100,i=0;
var number = Math.round(Math.random() * Max);
var obj_tab = document.getElementsByTagName('table');
var tab_num = obj_tab.length;
for(;i<tab_num;i++){
//可以定位确定的对象，可以在firefox下使用expression
obj_tab[i].style.number = ":expression(" + evalcls(obj_tab[i]) + ");";
}
}
</script>
HTML：
<body οnlοad="setstyle();">
<table>
<tr>
<td><img src="images/tree1.jpg" /></td>
</tr>
<tr>
<td>test</td>
</tr>
<tr>
<td>test1</td>
</tr>
<tr>
<td>test2</td>
</tr>
</table>
<table>
<tr>
<td><img src="images/tree1.jpg" /></td>
</tr>
<tr>
<td>test</td>
</tr>
<tr>
<td>test1</td>
</tr>
<tr>
<td>test2</td>
</tr>
</table>
</body>
在上面代码中，一部分代码沿用了别人的示例，自己就增加了setstyle 函数。需要注意的地方就
是，body 的onload事件调用了这个setstyle，目的很明确：只有html加载完毕，才能获取到节点，
才能进行操作。Setstyle里用的是动态的创建自定义属性，本想测试 植入frame 的，但是可想而
知，我没有成功。后来想了下，可以用addRule或 insertRule创建css 解决 加载问题（如果说
client不支持js，那我也没法了，只希望能找到iframe文章的作者请教下）。
5. expression占浏览器资源，应该是加载页面时就调用js，防止被植入frame的办法也是下下策，
正如第一篇文章的作者说的，“堵住源头”才是根本，所以就是尽量少用，必须用的时候才用
文章比较杂乱，是自己记录下，方便以后自己查找，如果能帮助人那就更好了，呵呵！
扫一扫
2225
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
