真的好奇怪噢。这样做吧?<style>
.link
{
meizz:expression(void(this.outerHTML="<span><a href='http://www.csdn.net/'>csdn</a></span>"));
}
</style><span class=link></span>
.link
{
meizz:expression(void(this.outerHTML="<span><a href='http://www.csdn.net/'>csdn</a></span>"));
}
</style><span class=link></span>
明明已经有了这个链接存在, 为何又是点击无效??
现又增加了一个问题, innerHTML 与 outerHTML 这两个方法为何在本问题里效果不同??
.link
{
meizz:expression(void(this.innerHTML="<a href=http://www.csdn.net/>csdn</a>",this.className='',this.style.meizz=''));
}
</style><span class=link></span>
expression有点象onPropertyChange,动不动就算个不停,大概是它算的浏览器都不知道要怎么处理它里面的超链接了。
<BODY >
<style>.link{meizz:expression(void(t1.innerText=b++));}</style>
<span class=link></span><BR>
expression:<span id=t1></span><BR>
setinterval:<span id=t2></span>
<SCRIPT LANGUAGE="JavaScript">
<!--
var a=0,b=0;
setInterval("t2.innerText=a++",100)
//-->
</SCRIPT>
</BODY>t1被t2拖着拼命跑呵呵。expression显然对整个page都敏感。
我对这个问题的解释是这样:<style>
.link1
{
meizz:expression(this.innerHTML="<a href=http://www.csdn.net/ onmousedown=alert('down') onmouseup=alert('up')>csdn</a>");
}
.link2
{
meizz:expression(this.innerHTML="<a href=http://www.csdn.net/ onmouseup=alert('up')>csdn</a>");
}
.link3
{
meizz:expression(this.innerHTML="<a href=http://www.csdn.net/ onclick=alert('click')>csdn</a>");
}
</style><span class=link1></span>
<BR>
<span class=link2></span>
<BR>
<span class=link3></span>我们点击链接的时候,首先触发了onmousedown事件(之后是否触发了expression还不得而知),然后是onmouseup事件,接着expression出手了,它把span的innerHTML重新计算过。这个时候span里面的超链接已经是新的超链接对象了,这个超链接还没被click过呢,怎么会执行跳转呢?
<style>
.link
{
meizz1:expression(this.innerHTML="<a href=http://www.csdn.net/>meizz</a>");
meizz2:expression(this.className="");
}
</style><span class=link></span><br><br><br>
如文章输出自适应高度:以前用onpropertychange,现在可以用
<textarea rows=1 name=s1 cols=27 style="height:expression(this.scrollHeight);overflow-y:hidden;">
textrear
gyg
u
</textarea>
但具体它是怎样工作还是弄不清楚
<style>
.link
{
meizz:expression(this.innerHTML="<a href=http://www.csdn.net/ onmousedown=\"t.innerText='down'\" onmouseup=\"t.innerText='up'\" onclick=\"t.innerText='click'\">csdn</a>");
}
</style>
<span class=link></span>
<BR>
<BR>
<span id=t>
我认为meizz1:expression(this.innerHTML="<a href=http://www.csdn.net/>meizz</a>");写成meizz1:expression(void(this.innerHTML="<a href=http://www.csdn.net/>meizz</a>"));会好一点。从span的outerHTML可以看出来。
.link
{
cursor:hand;
text-decoration:underline;
meizz:expression(this.onclick=function(){document.location="http://www.csdn.net"});
}
</style><span class=link>test</span>
innerHTML 对下面的对象只读:
COL, COLGROUP, FRAMESET, HTML, STYLE, TABLE, TBODY, TFOOT, THEAD, TITLE, TR.
查了查,还是没搞清楚
.link
{
meizz:expression(this.innerHTML="<a href=http://www.csdn.net/ onmousedown=\"t.innerText='down'\" onmouseup=\"t.innerText='up'\" onclick=\"t.innerText='click'\">csdn</a>");
}
</style>
<span class=link></span>
<BR>
<BR>
<span id=t>
在页面中不要过多的使用,尤其是嵌套触发的表达式.建议只将表达式用在很少触发的属性中
<SCRIPT>var a=0;</SCRIPT>
<style>.link{meizz:expression(void(t1.innerText=a++));}</style>
<span class=link id=t0>test</span><BR>
expression:<span id=t1></span><BR>
<button onclick="document.getElementById('t0').outerHTML=''">test</button>
</BODY>
<style>.test{gorush:expression(window.status=i++)}</style>
<input class="test" id=t>
<input type=button value="clear" onclick="t.className=''">
<input type=button value="clear2" onclick="t.style.cssText=''">
<input type=button value="clear3" onclick="t.style.removeExpression('gorush')">只有 clear3才真正删除了expression1.
expression是和element绑定的,而不是css,一旦被绑定,除非这个element被销毁,或者
用removeExpression方法删除,这个 expression都还是绑定并作用于element上面的。2.
expression是极其消耗资源的,一旦被绑定,页面上任何element触发任何事件都将导致
expression重新计算(是整个页面所有element的所有expression都重新计算).所以。如果
过多的使用expression,或者喜欢在expression中使用外部函数的话,往往导致ie页面死掉
cpu占用,和内存使用狂升
另:可以用 document.recalc(true)强迫ie重新计算expression3.(to 阿信)
expression虽然是和element绑定的,但是编程的时候还是用的css的属性。除非万不得以或者
要达到特殊目的才用自定义属性。
我以前看到过有人这样写:
style="csdn:expression(this.style.height=this.scrollHeight)"
这样完全是画蛇添足,可以写成:
style="height:expression(this.scrollHeight)"
这里this.scrollHeight是内容的真实高度 4.(to 梅花鱼)
innerHTML和outerHTML其实和本贴无关,因为他们和expression没有区别。
innerHTML改变了一个element的内部,但是对element本身,是没有改变的,他的
属性等等都不变。所以expression依然有效
而对于ie来说,outerHTML相当于重构element,expression作为element的一个属性
如果在新的outerHTML没有显式指定expression的话,原有expression是不会再绑定
element的5.(to emu_ston)
同意你的意见。
<style>
.link{meizz:expression(this.innerHTML="<a href=http://www.csdn.net/>csdn</a>");
}
</style>
<span class=link></span>实际上那个链结是不可能被点击到的。在你的鼠标移动过程中,expression已经发生作用
span里面的innerHTML又产生了变化.所以链结是客观存在的,只是可望而不可及而已
BTW:
我可能要告别it业,javascript版了,以后可能不会再来和大家讨论问题了。改天我有
时间再开贴整结一下expression的使用技巧.
===>
innerHTML和outerHTML其实和本贴无关,因为他们和expression没有联系。
expression是和element绑定的,而不是css,一旦被绑定,除非这个element被销毁,或者
用removeExpression方法删除,这个 expression都还是绑定并作用于element上面的。
-------------------------------------------------------------------------------
在我的试验中销毁了都没用啊:<BODY >
<SCRIPT>var a=0;</SCRIPT>
<style>.link{meizz:expression(void(t1.innerText=a++));}</style>
<span><span class=link id=t0>test</span></span>
<BR>
expression:<span id=t1></span><BR>
<button onclick="t0.parentNode.removeChild(t0)">test</button>
</BODY>-------------------------------------------------------------------------------
页面上任何element触发任何事件都将导致
expression重新计算
-------------------------------------------------------------------------------
好像mouseup例外,看来IE还没有笨老姥姥家(见前面的试验)
我拿你的代码测试了,element被删除后,a就不会增加了。页面上任何element触发任何事件都将导致expression重新计算
是的,我这里测试mouseup也会导致重新计算的。为什么你的会这样呢?
用htc又有什么好的?
但是htc更好的实现面向对象的特性,资源消耗比表达式好多了.
http://uploads.newgrounds.com/89000/89818_bush.swf