jQuery:如何将一个类添加到多个同名元素？
在jQuery中，可以使用.addClass()方法将一个类添加到多个同名元素。
首先，需要选择所有需要添加类的元素。可以使用元素选择器、类选择器、ID选择器等来选择元素。例如，如果要选择所有同名的<div>元素，可以使用类选择器.classname来选择它们。
然后，使用.addClass()方法来添加类。该方法接受一个参数，即要添加的类名。例如，如果要将类名为newClass添加到所有选中的元素上，可以使用以下代码：
$(".classname").addClass("newClass");这样，所有同名元素都会添加newClass类。
以下是一个完整的示例：
<!DOCTYPE html>
<html>
<head>
<title>jQuery Add Class to Multiple Elements</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<style>
.newClass {
color: red;
font-weight: bold;
}
</style>
</head>
<body>
<div class="classname">Element 1</div>
<div class="classname">Element 2</div>
<div class="classname">Element 3</div>
<script>
$(document).ready(function() {
$(".classname").addClass("newClass");
});
</script>
</body>
</html>在上述示例中，我们选择了所有类名为classname的<div>元素，并将类名为newClass的类添加到它们上面。添加的类会改变元素的文本颜色和字体粗细。
推荐的腾讯云相关产品：腾讯云服务器（CVM）和腾讯云云函数（SCF）。
- 腾讯云服务器（CVM）：提供可靠、安全、灵活的云服务器，适用于各种应用场景。
- 腾讯云云函数（SCF）：无服务器计算服务，支持事件驱动的函数计算，无需管理服务器，按需弹性扩缩容。
请注意，以上只是推荐的腾讯云产品，其他云计算品牌商也提供类似的产品和服务。
相关·内容
4回答
我有很多具有相同name属性的input。我知道如何将它们都作为jQuery对象获取！
console.log()会打印出类似如下的内容：
[
<input type="checkbox" name="people" value="33" checked="checked">
,
<input type="checkbox" name="people" value="1" checked="checked">
]
之后，我
浏览 0提问于2011-09-16得票数 4
回答已采纳
我有这个代码的网页：-
<article class="media content-section">
<div class="media-body">
<h2><a id="post_title" class="article-title" href="/post/new/">new</a></h2>
<div class="article-metadata">
浏览 6提问于2020-09-19得票数 0
我正在用jQuery创建一个进度条，但问题是我正在用组件的id连接JQuery，但是一旦我用相同的id创建了新的组件，work.What不是解决这个问题的方法吗？我正在附加我的HTML代码& CSS。所有其他文件都是常见的jQUERY库。
<body>
<script >
$(function(){
$("#status").animate( { width: "80%" }, 2000);
});
</script>
<div id="progress-bar">
&l
浏览 6提问于2011-06-06得票数 0
回答已采纳
我是jQuery的新手。我有以下代码：
jQuery(document).ready(function() {
jQuery('#carousel').jcarousel();
});
它只适用于带有id="carousel"的第一个ul，而不适用于其他的。如何将其应用于具有相同ID的所有元素？
HTML：
<!-- jQuery applies to this div -->
<div id="slideshow-carousel">
<ul id="carousel" class=
浏览 0提问于2013-01-11得票数 2
回答已采纳
1回答
HTML选择不将值发回PHP
、、、、
我在html表单中有一个选择框，它不会将值发回php。
<select multiple='multiple' name='mydropdown'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
</select>
在PHP中，如果我查看一下$_REQUEST，它将返回最
浏览 2提问于2014-05-11得票数 0
回答已采纳
我正在使用JQuery的显示和隐藏功能，它的工作原理就像当你点击图像时，它会打开一个信息日志。信息日志在页面的顶部打开，所以我需要当您单击页面底部的图像时，它会将您滚动到内容。
JQuery我正在使用的隐藏和显示内容：
jQuery(function() {
jQuery('.showSingle').click(function() {
jQuery('.targetDiv').hide();
jQuery('#div' + $(this).attr('target')).show();
});
});
浏览 0提问于2019-05-06得票数 0
我对一个div有问题，它在it.Button上有一个按钮，id='delsts‘，整个div是从php获取的，如下所示：-
//php code
foreach ($data as $row) {
$status = $row['status'];
$fn = $row['firstname'];
$time =$row['posted_dt'];
echo "<div id='stsshown'>
浏览 3提问于2015-01-11得票数 0
回答已采纳
如何将css类添加到JQuery中的Div元素？我有一个带有css类的DIV，而div包含一个表单。单击submit后，我希望原来的css类消失，并添加一个新类？我正在使用JQuery作为框架
浏览 4提问于2009-07-07得票数 0
回答已采纳
2回答
我有很多jquery点击函数，它们非常相似，如何将它们组合起来以获得更短的代码。(使用regex还是使用array foreach?)
$(".menu").live('click', function() {
var value = $(this).html();
$('#menu').html(value);
});
$(".nav").live('click', function() {
var value = $(this).html();
$('#nav'
浏览 0提问于2011-10-11得票数 0
回答已采纳
我是jquery的新手，不知道如何向页面元素添加CSS id。
例如，下面是内联CSS stlyes：
#main h2 {
background: url(open.png) no-repeat 0% 10%;
padding-left: 20px;
cursor: pointer;
}
#main h2.close {
background-image: url(close.png);
}
#main h2.highlight {
color: red;
font-weight: bold;
text-transform: uppercase;
}
下面是我尝试的jquery：
$(doc
浏览 0提问于2011-03-17得票数 0
回答已采纳
我在子网格中有一个多选择，我想根据父网格设置编辑上的dataSource。我无法获得对multiSelect的引用，这里是我的代码，gridDetailInit工具变量的长度为0，这意味着找不到它。
<script type="text/kendo" id="territoriesTemplate">
<ul>
#for(var i = 0; i< data.length; i++){#
<li>#:data[i].text#</li>
#}#
</ul>
</sc
浏览 0提问于2014-01-15得票数 0
使用jQuery UI为我提供了这些不错的样式表。这些都适用于小部件..。的jQuery用户界面。但是，如何将这些样式应用到我自己的元素中以获得相同的外观和感觉呢？
当我更改jQuery UI主题时，我希望相应地更改页面。我知道有类似的问题，如“”。在那里，据说我只能打开CSS并手动将CSS类应用到元素中。
没有更好的/官方的方法来做这件事吗？特别是使用，我可以很容易地拥有一个可定制的UI。
--加上原来的问题--
好的，大家都向我解释，我必须手动将css类应用到元素中。我感谢你的信息，你当然比我有更多的CSS经验。但是，当我以后想要更改样式时，我必须在许多地方更改这个类(jQuery UI)
浏览 7提问于2011-08-04得票数 5
回答已采纳
如何通过jQuery将标题的值添加到类的值中？
例如，我将在1.jpg图片的标题名中添加单词"new1“。然后在图1.jpg的类中，它将得到jQuery的“jQuery”类。
<script>
$( document ).ready(function() {
$("[title*='animotion']").addClass('new1',function(){
$(this).parent().css('overflow','visible');
str
浏览 1提问于2015-03-09得票数 0
回答已采纳
我在一个页面上有多个id为"myDiv“的div实例。我想替换这些div的内容。当我使用这个javascript时：
function replaceContent(id, content) {
var container = document.getElementById(id);
container.innerHTML = content;
}
replaceContent('myDiv', 'hello there');
<div id="myDiv"></div>
<div id
浏览 3提问于2010-09-25得票数 1
回答已采纳
我们可以使用带有MVC 4.0的Enterprise Library 6.0的VAB执行客户端验证(Jquery/Javascript)吗
注意:我们不想使用Dataanotation。
我们已经浏览了很多链接，但所有的链接都只显示了用于客户端验证的Dataannotations。
浏览 1提问于2013-07-31得票数 1
作为jquery的新手，我面临着一个简单的问题。我有一个条件，有相同的类但不同的className。现在，我需要在data-id为true时显示一个html，在data-id为false时显示另一个html。我的代码是： <div class="emailSent" data-id="True"></div>
<div class="emailSent" data-id="False"></div>
<div class="emailSent" data-id
浏览 26提问于2020-08-27得票数 0
回答已采纳
5回答
我有这样一个jQuery语句；
var current = $(this);
current.hide();
current.siblings('.ab').hide();
current.siblings('.cd').hide();
我想把它变成一份声明，然后我写了下来；
$(current,current.siblings('.ab'),current.siblings('.cd')).hide();
但ab并没有躲藏。如何将3 hide()语句组合成一个语句？
浏览 8提问于2014-04-10得票数 5
回答已采纳
有没有一种方法可以写一个jQuery方法来删除选定的文件来清除它？如何将文件名传递给jQuery以重置文件输入？ 我不想一次清除所有文件。 以下是我的文件： Attach Competitor:
Remove
Attach 2
Remove
Attach Additional Information:
浏览 43提问于2017-08-28得票数 1
回答已采纳
4回答
当我尝试在jfiddle中使用下面的代码时，我注释掉了jinja，按钮按预期隐藏，但在浏览器中，输入按钮不会隐藏
{% extends "layout.html" %}
{% block body %}
<div>
{% if session.logged_in %}
<form action="{{ url_for('add_entry') }}" method=post class=add-entry>
<dl>
<dt>Stock Ticker:
浏览 0提问于2013-11-30得票数 0
1回答
我有一个2栏的网站，它的工作很好，直到我尝试应用砖石id到我的右手列(我想要砖石应用到的列)。我的问题是，如何将JQuery Masonry应用于浮动在左侧的列？我甚至尝试过将masonry id div放入浮动列中，但仍然不起作用。有人知道解决方案吗？
浏览 2提问于2013-10-23得票数 0
如何将下面的代码封装到一个函数中(jQuery新手)
<script type="text/javascript">
$('.job:has(.active)').addClass('active');
$('.employers:has(.active)').addClass('active');
$('.about:has(.active)').addClass('active');
</script>
执行上述操作时，只需使用最后一个。
浏览 0提问于2014-05-14得票数 1
我这里有一把小提琴：
我希望发生的事情是，当我将鼠标悬停在a标签上时，它会显示动画效果，在左侧添加一些填充和边框。它只对第一个(Home)这样做，但对其他(据我所知)相同的部分不这样做。
我觉得我遗漏了一些很明显的东西。就像，当我找出原因的时候，我会拍拍我的额头。但是jQuery只有4行错误，我真的看不出哪里错了。
浏览 4提问于2013-01-27得票数 3
回答已采纳
我使用以下代码来选择页面上的所有外部链接
items = jQuery("a[href^=\'http:\']").not("[href*=\'" + window.location.host + "\']");
但我需要从一些已知类的标签中排除链接，例如，我想排除"class1“和"class4”，并选择剩下的所有链接。
<body>
<div>
<p class="class1">
<span class="class
浏览 1提问于2010-06-10得票数 0
1回答
我创建了一个引导侧边栏面板作为选项卡导航。如何控制处于活动状态的选项卡？我知道有“活动”类，但是我如何设置它，当你点击一个“标签”时，它会被激活，这样它就会正确地突出显示？这会是JS/Jquery的事情吗？我猜这是一件很常见的事情，我只是无法通过stackoverflow或google找到答案。谢谢!
浏览 2提问于2015-08-25得票数 0
我有一个表单，用户可以用jQuery添加输入字段。
<input type="text" id="task" name="task[]" />
提交表单后，我得到一个PHP格式的数组。
我想用$.ajax()来处理这个问题，但是我不知道如何将我的<input>转换成jQuery中的数组。
提前谢谢。
浏览 1提问于2010-04-13得票数 65
回答已采纳
如何将JavaScript DOM对象转换为jQuery对象？
<tr onclick="changeStatus(this)">
function changeStatus(myObject) {
XXX.removeClass();
}
我应该写什么来代替XXX呢？我知道我可以使用id和id选择器来解决这个问题，但它并不是那么优雅。有没有办法将js DOM对象转换为jQuery对象，或者在jQuery中使用this关键字？
浏览 3提问于2012-02-29得票数 47
回答已采纳
当选中多个同名文本框时，如何添加Jquery验证？
Jquery:
$("input:[name='abc']").change(function() {
var method = $(this).val();
if ($(this).is(':checked')) {
$("#" + method).spinner({
'disabled': f
浏览 1提问于2015-02-09得票数 0
我试图为我的最后一个项目做一个做的应用程序。我遇到的问题是，我希望div标记能够根据用户单击的内容向上或向下移动。我可以用先前存在的div标记来完成这个任务，但是附加div标记代码就会崩溃。任何洞察力都将不胜感激。我有代码上的代码，所以我将在那里提供一个链接，我也将在这里显示我的代码。
$('#addTask').click(function(){
var task = $('#taskadd').val();
var date = $('#datepicker').val();
$('<div id
浏览 3提问于2016-12-13得票数 0
回答已采纳
关于CSS的问题。
我正在研究一些过时的密码。此代码有自己的css规则，链接到某些css管理器.现在我想用jQuery UI和它的漂亮可爱的对话等等。
现在我的问题是:我有个css规则说.
#菜单栏{某事}
jQuery UI使用的规则如下：
..ui对话框-标题栏{something2}
我可以(不修改jQueryUI样式表)做一些类似于：
.ui-dialog-titlebar = #menu-bar?
那么..ui对话框标题栏将被#菜单栏中的{dialog}覆盖？
提前谢谢。
PS。让我补充一点，我不能简单地
.ui-dialog-titlebar {something}
因
浏览 1提问于2011-09-26得票数 0
回答已采纳
我使用以下代码将一个元素的类更改为一个新类：
$("#change_color_scheme_1").on("click", function(){
$(".bg1_color_1").attr("class","bg1_color_2");
});
这很好，但是如果我的元素附加了多个类，比如div class="class1 class2 class3"，它就停止工作了。我假设它会将所有这3个类都更改为一个类。不管怎么说，是否只需要用jquery来锁定和替换其中一个类呢？因此，基本上我可以
浏览 0提问于2014-05-20得票数 1
回答已采纳
4回答
下面的代码是由简单的Html Dom解析器生成的：
<a href='....'>
<div class='test'>...</div>
</a>
如何将类添加到a元素中？我假设我可以用Jquery来完成这个任务？
我只需要将类添加到具有类'test‘作为子代的div元素中。
浏览 7提问于2014-07-07得票数 0
回答已采纳
1回答
如何将项目传递给Joomla中的jQuery函数"ready()“？
$(document).ready(function(){
// some code...
});
我已经在使用这个函数了，其中的大多数项目都是静态的(不会根据模块等而改变)。然而，在某些情况下，我需要向这个函数“注入”额外的代码。
特别是，我有一个自定义的JS函数来设置元素的背景图像，它在这个函数中被调用，如下所示：
// Set background of element with ID and image path.
setBackgroundImage("img-2","glo
浏览 0提问于2010-08-28得票数 0
回答已采纳
我有一个页面，其中包含从数据库导出的一些表，在表的顶部和底部有一个下拉框，用户可以在该框中选择要显示的行数。
当我只有一个的时候，我使用了ID="num"，但是现在我对两者都使用了class="num“，但是它不起作用。
<select class="form-control" class="num">
<option value="10">10</option>
<option value="20">20</option>
&
浏览 5提问于2014-03-21得票数 1
回答已采纳
2回答
我正在尝试使用JQuery教程中指定的datepicker添加日历对象。这是一个事件表单，我需要添加更多的事件来选择不同的事件日期，所以我要做的就是复制表单中的元素以便重用。这意味着日历输入标记也会被复制。但是，执行此操作后，日历datepicker方法将不会调用(或者至少不会弹出日历)。这一切为什么要发生？我的代码就在这里：
<html>
<head>
<title>Calendar duplicate testing</title>
<script type="text/javascrip
浏览 1提问于2014-11-12得票数 1
首先，如果这是一个简单的问题，很抱歉。我是jQuery新手，我想知道如何检查元素是否存在，如果存在，就更改css属性。
我的意思是:我有以下清单：
<ul class="element-rendered">
<li class="element-choice">Item A</li>
<li class="select-inline">Item B</li>
</ul>
我想知道如何检查select-inline类是否存在于element-rendered中，
浏览 18提问于2015-10-07得票数 3
回答已采纳
1回答
在我的网站上，我有一些带有工具提示的元素。现在，我处理工具提示的方式是使用纯css和一个属性。下面的代码应该可以帮助您理解：
.my-container [tooltip]:before {
bottom: 25%;
font-weight: 600;
border-radius: 2px;
background: #585858;
color: #fff;
content: attr(tooltip);
font-size: 12px;
visibility: hidden;
浏览 0提问于2016-11-03得票数 1
4回答
我正在用一些数据填充一个表。我不知道这个表包含多少行。每一行都有一个链接，如果我单击该链接，将显示该行的详细信息。
现在，我希望将单个jQuery绑定到每个超链接。此函数将接收每一行的唯一id；并执行ajax以获取该行的更多数据：
下面是HTML的样子( id是一个实际数字)：
<a id="view-id">
<img src="/resources/assets/graphics/view.png" class="action-button" alt="View" title="View
浏览 4提问于2015-03-24得票数 1
回答已采纳
使用asp.net mvc3和jquery
我在一个页面上有x个表单，每个表单都是在用户添加新项时创建的。每个表单在c#中表示一个模型。每个表单都有一个字符串列表作为其中一个属性。我希望有一个save all按钮来提交所有表单，但我想在执行此操作之前将它们序列化为一个对象列表，然后在后端对其进行排序。我怎样才能用jQuery做到这一点？
<form>
<input name="ListThing" value="one" />
<input name="ListThing" value="tw
浏览 1提问于2011-03-31得票数 3
回答已采纳
5回答
我只想用jQuery更改类中的一个元素
.myClass
{
background-color:#FFFFFF;
}
我想通过编程来改变这一点。
浏览 1提问于2009-11-21得票数 0
回答已采纳
正如标题所述，如果jquery中的一组元素已经属于某个类，我该如何命名和选择它们？
如果我有两个div：
<div id="whateverDiv" class="bigstyle"/>
<div id="whateverDiv2" class="smallstyle"/>
那么是否可以添加一个类(结果如下)：
<div id="whateverDiv" class="bigstyle slider"/>
<div id="whateverDiv2&
浏览 0提问于2012-05-25得票数 0
回答已采纳
我正在做一些jQuery魔术，我需要标记一个<li>来做一些特别的事情。由于某些其他约束，我不能使用class或id。为了让jQuery可以找到元素，我还可以在其中添加哪些其他属性？
浏览 0提问于2011-05-25得票数 2
回答已采纳
4回答
在jquery中创建元素
、、、
因此，我知道如何在jQuery中以各种方式创建元素。但在今天之前我从未遇到过这样的情况：
var myspacer = $('<div />', {
"id": "nav-spacer",
"height": mynav.outerHeight()
});
在后面的代码中，这个变量将通过jQuery的.before()方法添加到DOM中。有人能解释一下这是怎么回事吗？正在创建的是什么类型的对象？jQuery如何知道如何将其转换为HTML元素？
浏览 1提问于2012-07-20得票数 2
回答已采纳
2回答
我们使用jQuery UI选择菜单，它重写了下拉框，如下所示：
<select style="width: 324px; display: none;" id="speedA" name="fruits">
<option value="NA">Please Select</option>
<option value="A">Apple</option>
<option value="O">Orange&
浏览 2提问于2011-08-30得票数 1
回答已采纳
“我有两个带有相同id的div的html在jquery中我让它在IE8/firefox/chrome中用$('#idname')选择容器它改变了两个div上具有相同id的html，但在ie7和更低的版本中它只改变了1，我怎样才能使它与ie7兼容以选择所有具有id的div?我会使用类，但我已经有一个类，这些div的每个div共享相同的类名。除了id之外，我还可以使用div标签吗?”
好的，我知道div的id应该是唯一的，除了title之外，我还可以使用其他的标签吗?因为它将工具提示鼠标悬停在div上，这样我就可以在jquery中选择值了。
谢谢
浏览 0提问于2010-09-21得票数 2
回答已采纳
3回答
我有一个输入按钮，在那里是写在一个刀片前奏循环在一个拉拉项目。
<div class="v-percentage">
<input id="copycode" type="Submit" value="Embed">
</div>
我正在编写一个脚本，允许我在输入中添加一个目标属性，以便每个按钮都是唯一的，并执行类似于这个答案的操作。到目前为止，我编写的脚本应该得到元素，然后在for循环中添加目标，我还不确定该如何做到这一点。
var elements = document.get
浏览 6提问于2014-03-19得票数 1
回答已采纳
我不明白为什么这个jQuery函数总是出现这个错误。有什么想法吗？
$(document).ready(function(){
$(document).on('click','.hideshow',function() {
var t = $(this).id;
t.slideToggle("fast");
});
});
浏览 0提问于2016-03-14得票数 0
我想知道如何在JavaScript数组中单击一个按钮之后从HTML字段存储一个值，然后了解如何将该数组数据显示到屏幕上。
谢谢，下面是我的html代码：
<!DOCTYPE HTML>
<html>
<head>
<title>Checklist</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
</head>
<b
浏览 1提问于2016-05-30得票数 0
回答已采纳
3回答
我正在尝试从生成到div中的按钮捕获事件(由另一个jQuery调用提供)。我想知道jQuery调用应该在哪里？是放入主页，还是放入前一次jQuery调用生成的html？
另外，jQuery如何处理具有相同名称的对象？
谢谢!
浏览 1提问于2012-09-03得票数 0
回答已采纳
1回答
我想在提交之前删除一个form字段，这样它就不会抛出http请求，但仍然可供用户使用。这是我的表单提交函数：
$.ajax({
url: vm.basePath + vm.configProprs.apiEndPoint.formPath,
type: 'POST',
data: $('#p2pForm').serialize(),
success: function(response) {
$log.log(response);
vm.processResponse(response, vm.details);
},
e
浏览 9提问于2017-08-03得票数 1
回答已采纳
我注意到在没有索引的情况下，jQuery中的className属性不起作用，为什么？
此外，在jQuery中是否还有其他常见的JS属性/方法无法按预期工作？
HTML：
<div class="par">test</div>
JQuery：
$(function () {
var el = $('.par');
el.className += ' new class'; // doesn't work
el[0].className += ' new class'; //
浏览 0提问于2013-05-17得票数 2
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
