Firefox如何呈现链接

Question

我只想分享一些我对Ubuntu Jaunty上的Firefox 3.5如何呈现HTML的观察：

我的JSP页面中有以下条目：

<a title="myLink" href="[some url]">link 1</a>
<a title="myLink" href="[some url]">link 2</a>
<a title="myLink" href="[some url]">link 3</a>

<a title="myLink"  class="hiddenLink"  href="[some url]">link 4</a>
<a title="myLink"  class="hiddenLink"  href="[some url]">link 5</a>
<a title="myLink"  class="hiddenLink"  href="[some url]">link 6</a>

<button>more links</button>

以上链接在Firefox上显示为：

链接4到链接6被隐藏。

链路1 link2 link3

我使用jQuery在“更多链接按钮”上附加了一个javascript：

$("a[href ^='myLink']:hidden").show();

在页面上显示链接4到6。如果我点击“更多链接”按钮，下面是firefox呈现链接的方式：

链路1 link2 link3

链路4

链路5

链接6

Answer 1

可能是因为当您调用show()时，jQuery将display style属性设置为display="block“，而不是将display=设置为”inline“。试试这个：

$("a[href ^='myLink']:hidden").css('display', 'inline');

或者：

$("a[href ^='myLink']:hidden").removeClass();

Answer 2

这是因为.show()将它们变成了块：

此函数用于在页面上隐藏匹配的元素时显示这些元素。它实际上将显示样式更改为“block”。这可能会在页面布局中造成一些问题，因为它会在元素的前后插入换行符，但对于一般用途来说，它是完美的。有关更灵活的用法，请查看.addClass()和.removeClass()函数。

我建议用.removeClass('hiddenLink')代替.show()。

或者，"hiddenLink“不仅仅是隐藏链接，当它们变得可见时，您是否希望它们看起来与其他链接不同？