表达式组合JS和CSS

IE5及其以后版本支持的表达在CSS的使用,它是用来把CSS属性javas cript表达式。CSS属性可以是内在的属性或自定义属性。也就是说,CSS属性可以是一个javas cript的表达,和CSS属性的值是相等的javas cript表达式的结果。元素本身的属性和方法可以直接引用的表达,和其他浏览器对象可以用。这种表达似乎在元素的成员函数是相同的。

将固有属性值分配给元素

例如,您可以根据浏览器的大小定位元素的位置。

{ # mydiv
位置:绝对;
宽度:100px;
身高:100px;
左:表达(document.body.offsetwidth - 110 +PX);
上图:表达(document.body.offsetheight - 110 +PX);
背景:红色;
}

分配一个自定义属性赋值给一个元素

例如,删除页面上的链接虚线:

link1
Link2
链接

粗略地说,它可能看不出使用表达式的优点。但是如果你的页面上有几十个甚至几百个链接,你会用机械式的Ctrl + C,Ctrl + V吗

使用表达式的实践如下:


一个{明星:表达(onfocus =这。模糊)}

link1
Link2
链接

描述:恒星内部的财产是自己随意定义,你也可以定义自己的喜好,然后包括在表达(JS)在声明的自定义属性和表达之间的脚本,别忘了还有一个引号,因为实质是CSS,所以放在风格的标签,而不是小in.ok,所以很容易用一个句子来实现链路消除页面中的线框。但不要骄傲吧。如果触发效果是CSS属性的改变,结果将与你的不同,例如,你想用鼠标移动并改变页面框颜色变化中的文本,你可能认为它实际上没有发生,应该写成


输入
{明星:表达(onmouseover =这个风格。背景颜色=# FF0000);
onmouseout=这个风格。背景颜色=# ffffff})}


输入{明星:表达(onmouseover =这个风格。背景颜色=# FF0000);
onmouseout=这个风格。背景颜色=# ffffff})}





因此,存在一个脚本错误,正确的编写方法是将CSS样式的定义写入函数,如下所示:


输入{明星:表达(onmouseover =函数())
{这个风格。背景颜色=# FF0000},
onmouseout=函数(){这个风格。背景颜色=# ffffff} })}





敬告

这是不必要的,一般不推荐使用表达式,因为表达式对浏览器资源有更高的要求。

示例:在CSS中使用表达式实现对接口对象的批处理控制

问题描述:对于CSS样式,您可以定义一个类属性来指定具有统一接口样式的多个对象。但如何统一等事件的同一类型的对象的接口有一个鼠标如何实现这个画面,画面是SRC为××_over.jpg


解决方案:使用CSS的表达方法,
要实现CSS的实现。

替换图片CSS *
# imgscript { / *这里使用ID的对象传递的风格,还可以定义一个CSS功能。
明星:表达(
onmouseover =功能()
{
替换图片
如果(this.hover!= NULL){
this.name = this.src;
This.src = this.src.replace (''.jpg'',''_over.jpg'');
this.haschg = 1;
}
},
onmouseout=功能()
{
应还原原图片。
如果(this.haschg!= NULL){
this.src = this.name;
this.haschg = null;
}
}


} / * * / imgscript