JavaScript Tutorial/jQuery/addClass
Содержание
addClass(class) adds the specified class(es) to each of the set of matched elements.
<source lang="javascript">
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("p:last").addClass("selected");
});
</script>
<style>
.selected { color:red; }
</style>
</head>
<body>
<body>
A
B
C
</body>
</html></source>
Add class to a selected Tag
<source lang="javascript">
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("p:last").addClass("selected");
});
</script>
<style>
.selected { color:red; }
</style>
</head>
<body>
<body>
A
B
C
</body>
</html></source>
Adds the classes "selected" and "highlight" to the matched elements.
<source lang="javascript">
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("p:last").addClass("selected highlight");
});
</script>
<style>
.selected { color:red; }
.highlight { background:yellow; }
</style>
</head>
<body>
<body>
A
B
C
</body>
</html></source>
Adds the class "selected" to the matched elements.
<source lang="javascript">
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("p:last").addClass("selected");
});
</script>
<style>
.selected { color:red; }
</style>
</head>
<body>
<body>
A
B
C
</body>
</html></source>
Add style class to tag
<source lang="javascript">
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<style type="text/css">
a.test { font-weight: bold; color:red;}
</style>
<script type="text/javascript">
$(document).ready(function(){
$("a").addClass("test");
});
</script>
</head>
<body>
<a href="http://wbex.ru/">wbex.ru</a>
</body>
</html></source>
Add two classes
<source lang="javascript">
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("p:last").addClass("one two");
});
</script>
<style>
.one { color:red; }
.two { border:1px solid blue; }
</style>
</head>
<body>
<body>
A
B
C
</body>
</html></source>
