内联样式充当：hover在CSS中
我知道将CSS样式直接embedded到他们所影响的HTML标签中会大大影响CSS的用途，但是有时这对于debugging的目的很有用，如下所示：
<p style="font-size: 24px">asdf</p> embedded规则的语法如下：
a:hover {text-decoration: underline;}
进入A标签的样式属性？ 这显然不是这个…
<a href="foo" style="text-decoration: underline">bar</a>
…因为这将始终适用，而不是在盘旋期间。
恐怕不能完成，伪类select器不能在线设置，你必须在页面或样式表上执行。
我应该提到， 技术上你应该能够按照CSS规范来做，但大多数浏览器不支持它
编辑：我只是做了这个快速testing：
<a href="test.html" style="{color: blue; background: white} :visited {color: green} :hover {background: yellow} :visited:hover {color: purple}">Test</a>
而且在IE7，IE8 beta2，Firefox或Chrome中不起作用。 任何人都可以在其他浏览器中testing吗？
如果你只是debugging，你可能会使用JavaScript来修改CSS：
<a onmouseover="this.style.textDecoration='underline';" onmouseout="this.style.textDecoration='none';">bar</a>
如果是用于debugging，只需添加一个CSS类hover（因为元素可以有多个类）：
a.hovertest:hover { text-decoration:underline; } <a href="http://example.com" class="foo bar hovertest">blah</a>
简单的解决scheme：
<a href="#" onmouseover="this.style.color='orange';" onmouseout="this.style.color='';">My Link</a>
要么
<script> /** Change the style **/ function overStyle(object){ object.style.color = 'orange'; // Change some other properties ... } /** Restores the style **/ function outStyle(object){ object.style.color = 'orange'; // Restore the rest ... } </script> <a href="#" onmouseover="overStyle(this)" onmouseout="outStyle(this)">My Link</a>
我为任何想要使用onmouseover和onmouseout行为创buildhover弹窗而没有CSS的快速解决scheme。
<div style="position:relative;width:100px;background:#ddffdd;overflow:hidden;" onmouseover="this.style.overflow='';" onmouseout="this.style.overflow='hidden';">first hover<div style="width:100px;position:absolute;top:5px;left:110px;background:white;border:1px solid gray;">stuff inside</div></div>
我不认为jQuery支持伪select器，但它确实提供了一个快速的方法来添加事件到单个页面上的一个，多个或所有类似的控件和标签。
最重要的是，您可以链接事件绑定，并在一行脚本中完成所有操作。 比手动编辑所有HTML来打开或closures它们要容易得多。 再次，因为你可以在CSS中做同样的事情，我不知道它会给你买什么（除了学习jQuery）。
