jquery 点击事件点击元素添加和移除class

我的目的是想点击元素1或者元素2的时候在元素1或者元素2上面额外加一个class才可以用CSS来控制当前被访问时的样式,代码肯定不对,(新手求指教)

<html>
<head>
<script src="../jquery/jquery-1.7.2.js"></script>
</head>
<body>
<script>
$(function(){
$(".nva a").click(function(){
$(this).addClass("active");
$(this).siblings().removeClass("active");
});
});
</script>
<div class="h">
<div class="logo"><img alt="se" src="../imgs/logo.png"></div>
<div class="nva">
<a href="#" target="_blank">元素1</a>
<a href="#" target="_blank">元素2</a>
<a href="#" target="_blank">元素3</a>
<a href="#" target="_blank">元素4</a>
<a href="#" target="_blank">元素1</a>
</div>
</div>
</body>
</html>
最新回答
ωǒ夨祛祢┈

2024-05-06 03:32:35

可以使用:$("#but").removeAttr("class");和$("#but").attr("class","but_test");来对标签进行元素的添加和删除。

  1. 为了直观性的看到结果,首先在css样式中,针对class选择该元素,之后添加相应的样式。

  2. 接下来,就给该button按钮添加一个点击事件,让它能过自由切换。

  3. 对该点击事件添加js函数。

  4. 运行后的结果为:

拓展资料:

jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。


思檀郎

2024-05-06 10:36:56

jquery中添加和移除class使用addClass()和removeClass()两个方法即可。

<script type="text/javascript">
   $(document).ready(function(){
       $(".nav a").click(function(){
            $(this).addClass("active");
            $(this).siblings().removeClass("active");
       });
   });
</script>
<div class="nav">
  <a href="#" target="_blank">元素1</a>
  <a href="#" target="_blank">元素2</a>
  <a href="#" target="_blank">元素3</a>
  <a href="#" target="_blank">元素4</a>
  <a href="#" target="_blank">元素1</a>
</div>

五品带砖侍卫

2024-05-06 02:14:31

一共三步,具体如下:

1、HTML结构:设计三个li元素<ul id="test">、 <li>Glen</li>、<li>Tane</li、<li>John</li>、</ul>。

2、css样式:设计一个类selected,表示选中后的效果<style> .selected{font-weight:bold; background: #ff99cc; color:#fff;}</style。

3、jquery代码:$(function(){$("#test li").click(function() $(this).siblings('li').removeClass('selected');  // 删除其他兄弟元素 $(this).addClass('selected');  // 添加当前元素的样式 });

1、removeClass()定义和用法:removeClass() 方法从被选元素移除一个或多个类。如果没有规定参数,则该方法将从被选元素中删除所有类。

2、addClass()定义和用法:addClass() 方法向被选元素添加一个或多个类。该方法不会移除已存在的 class 属性,仅仅添加一个或多个 class 属性。如需添加多个类,请使用空格分隔类名。




待在绿匣里的猫

2024-05-06 01:56:18

使用removeClass()方法移除class,使用addClass()方法添加class。


1、removeClass()定义和用法

  removeClass() 方法从被选元素移除一个或多个类。如果没有规定参数,则该方法将从被选元素中删除所有类。

       

  实例:移除所有 <p> 的 "intro" 类:

$("button").click(function(){
  $("p:first").removeClass("intro");
});

2、addClass()定义和用法

        addClass() 方法向被选元素添加一个或多个类。该方法不会移除已存在的 class 属性,仅仅添加一个或多个 class 属性。如需添加多个类,请使用空格分隔类名。


        实例:向第一个 p 元素添加一个类:

$("button").click(function(){
  $("p:first").addClass("intro");
});