将 css 添加到无序列表 <li>

【问题标题】：Adding css to unordered list <li>将 css 添加到无序列表 <li>
【发布时间】：2009-05-11 03:08:05
【问题描述】：

我有一个无序列表

<ul id="List1">
    <li>www.xyz.com</li>
    <li>www.abc.com</li>
</ul>

使用 jquery，我想将此 li 转换为链接并将字体添加为下划线

我是这样尝试的

$('li').css('font', 'underline').click(function () {
    // how to add hyperlink?
});

【问题讨论】：

标签： jquery

【解决方案1】：

这样的事情呢？这会将元素转换为实际的链接，因此您无需添加下划线或 onclick 处理程序。

    $('li').each(function(e) {
        $(this).wrapInner('<a href="http://' + $(this).text() + '"></a>');
    });

在您的示例中，列表项是 url，因此只有在这种情况下才有效。

【讨论】：

你可以使用这个语法：$('li a').css({ "text-decoration": "underline", "color": "#333333" });但是，如果您要更改几个 CSS 属性，我通常会创建一个新类，然后将该类分配给链接。

【解决方案2】：

你应该看看这个问题中提到的“linkify”方法：jQuery Text to Link Script?

【讨论】：