CSS表達(dá)式（css expression）又稱作為動(dòng)態(tài)屬性（Dynamic properties）是早期微軟DHTML的產(chǎn)物靖榕，用來(lái)把CSS屬性和JavaScript腳本關(guān)聯(lián)起來(lái)宵溅。CSS的屬性可以是元素固有的屬性逻恐，也可以是自定義屬性常侣，也就是說(shuō)CSS屬性后面可以是一段JavaScript表達(dá)式信柿，CSS屬性的值等于JavaScript表達(dá)式計(jì)算的結(jié)果但两。如以下實(shí)例是根據(jù)瀏覽器的大小來(lái)設(shè)置元素的位置。
left: expression(document.body.offsetWidth - 180 "px");
top: expression(document.body.offsetHeight - -80 "px");
CSS從IE5開(kāi)始得到支持吞获，后因標(biāo)準(zhǔn)况凉、性能、安全性等問(wèn)題各拷，微軟從IE8 beta2標(biāo)準(zhǔn)模式開(kāi)始刁绒，取消對(duì)css expression的支持。
微軟提供了4個(gè)css expression方法：getExpression烤黍、recalc知市、removeExpression、setExpression速蕊。有興趣可以參考MSDN嫂丙。一般最常用的是直接在css中使用expression。
CSS exprssion技術(shù)達(dá)到了可以使用表達(dá)式或公式來(lái)定義CSS屬性的目的规哲，MSDN針對(duì)CSS表達(dá)式給出的優(yōu)點(diǎn)是：減少頁(yè)面上的代碼跟啤，使設(shè)計(jì)師無(wú)需學(xué)習(xí)JavaScript就能實(shí)現(xiàn)一些DHTML的效果。但這種減少代碼主要是減少了JavaScript的代碼媳叨。
CSS表達(dá)式本身也存在很多缺陷：
1) 不符合WEB標(biāo)準(zhǔn)
CSS表達(dá)式這種在表現(xiàn)中插入行為的JavaScript代碼腥光，有悖于Web標(biāo)準(zhǔn)的結(jié)構(gòu)关顷、表現(xiàn)糊秆、行為相分離的理念。
2) 效率低
一個(gè)CSS表達(dá)式會(huì)反復(fù)執(zhí)行议双，因?yàn)樾枰煌５娜ビ?jì)算CSS的屬性值痘番，甚至執(zhí)行成百上千次，這會(huì)大大消耗計(jì)算機(jī)硬件資源平痰，極端情況下可能會(huì)導(dǎo)致瀏覽器崩潰汞舱。
3) 安全隱患
CSS表達(dá)式暴露了一個(gè)腳本執(zhí)行的上下文，可能帶來(lái)腳本注入的隱患宗雇。
為了避免常見(jiàn)的CSS表達(dá)式問(wèn)題昂芜，通過(guò)可以使用一次性表達(dá)式和處理事件。如果CSS表達(dá)式必須求值一次赔蒲，那么可以對(duì)這次執(zhí)行使用JavaScript代碼進(jìn)行重寫泌神，這樣可以避免元素改變大小良漱、滾動(dòng)或在頁(yè)面上移動(dòng)鼠標(biāo)時(shí)頻繁的對(duì)CSS表達(dá)式進(jìn)行求值。
表達(dá)式的問(wèn)題在于它們比大多數(shù)人期望的更頻繁地進(jìn)行評(píng)估欢际。它們不僅在頁(yè)面呈現(xiàn)和調(diào)整大小時(shí)進(jìn)行評(píng)估母市，而且在頁(yè)面滾動(dòng)時(shí)以及用戶將鼠標(biāo)移到頁(yè)面上時(shí)也進(jìn)行評(píng)估。向CSS表達(dá)式添加一個(gè)計(jì)數(shù)器可以讓我們跟蹤C(jī)SS表達(dá)式的評(píng)估時(shí)間和頻率损趋。
減少CSS表達(dá)式評(píng)估次數(shù)的一種方法是使用一次性表達(dá)式患久，第一次評(píng)估表達(dá)式時(shí)，它將style屬性設(shè)置為一個(gè)顯式值浑槽，該值將替換CSS表達(dá)式蒋失。如果樣式屬性必須在頁(yè)面的整個(gè)生命周期中動(dòng)態(tài)設(shè)置，則使用事件處理程序而不是CSS表達(dá)式是一種替代方法桐玻。如果您必須使用CSS表達(dá)式高镐，請(qǐng)記住它們可能會(huì)被數(shù)千次評(píng)估，并可能會(huì)影響頁(yè)面的性能畸冲。
出以以上的原因我們建議在前面開(kāi)發(fā)過(guò)程避免使用CSS表達(dá)式嫉髓。
