如果链接有类,应用样式+追加文本。

时间:2022-11-03 14:55:39

I'm trying to figure out how to add a style to a link & append text if it has a certain class.

我想知道如何在链接和附加文本中添加一个样式,如果它有某个类的话。

e.g.

如。

$("a").hasClass("Woohoo"));
$(".Woohoo").css({ font-style: "italic" });
$('.Woohoo').append('Some text');
} 

<a href=#">link 1</a>
<a class="Woohoo" href=#">link 2</a>
<a href=#">link 2</a>

should output:

应该输出:

link 2 Some text

链接2一些文本

3 个解决方案

#1


2  

You should use camelCase for Hyphenated properties and use Element Selector (“element”) along with Class Selector (“.class”) to target the desired element.

您应该使用camelCase来使用连字符属性,并使用元素选择器(“元素”)和类选择器(“. Class”)来锁定所需的元素。

$("a.Woohoo").css({ fontStyle: "italic" }).append('Some text');

OR

$("a.Woohoo").css({ "font-style": "italic" }).append('Some text');

$("a.Woohoo").css({
  fontStyle: "italic"
}).append('Some text');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href=#">link 1</a>
<a class="Woohoo" href=#">link 2</a>
<a href=# ">link 2</a>

#2


1  

Simply select link with class and do the remaining things. The property should be either quoted since it contains - in it or use came cased fontStyle instead.

简单地选择与类的链接,并做剩下的事情。该属性应该被引用,因为它包含-在它或使用中出现了fontStyle。

$("a.Woohoo").css({
  'font-style': "italic"
}).append('Some text');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href=# ">link 1</a>
<a class="Woohoo " href=#">link 2</a>
<a href=# ">link 2</a>

#3


0  

Or you could loop through all the link elements with that class

或者你也可以循环遍历所有的链接元素。

$("a").each(function () {
    if ( $(this).hasClass("Woohoo") ) {
        // do some magic here
    }
});

Or nicer

或者更好的

$("a.Woohoo").each(function () {
    // do some magic here
});

But simply

只是

$("a.Woohoo").css(... //etc

Should do what you want

应该做你想做的吗?

#1


2  

You should use camelCase for Hyphenated properties and use Element Selector (“element”) along with Class Selector (“.class”) to target the desired element.

您应该使用camelCase来使用连字符属性,并使用元素选择器(“元素”)和类选择器(“. Class”)来锁定所需的元素。

$("a.Woohoo").css({ fontStyle: "italic" }).append('Some text');

OR

$("a.Woohoo").css({ "font-style": "italic" }).append('Some text');

$("a.Woohoo").css({
  fontStyle: "italic"
}).append('Some text');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href=#">link 1</a>
<a class="Woohoo" href=#">link 2</a>
<a href=# ">link 2</a>

#2


1  

Simply select link with class and do the remaining things. The property should be either quoted since it contains - in it or use came cased fontStyle instead.

简单地选择与类的链接,并做剩下的事情。该属性应该被引用,因为它包含-在它或使用中出现了fontStyle。

$("a.Woohoo").css({
  'font-style': "italic"
}).append('Some text');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href=# ">link 1</a>
<a class="Woohoo " href=#">link 2</a>
<a href=# ">link 2</a>

#3


0  

Or you could loop through all the link elements with that class

或者你也可以循环遍历所有的链接元素。

$("a").each(function () {
    if ( $(this).hasClass("Woohoo") ) {
        // do some magic here
    }
});

Or nicer

或者更好的

$("a.Woohoo").each(function () {
    // do some magic here
});

But simply

只是

$("a.Woohoo").css(... //etc

Should do what you want

应该做你想做的吗?