Javascript 如何编辑多个类名？_Javascript_Html_Class_Loops_Iteration

Javascript 如何编辑多个类名？

javascript html class loops

Javascript 如何编辑多个类名？,javascript,html,class,loops,iteration,Javascript,Html,Class,Loops,Iteration,我的html： <a id="Year2016">2016</a> <div class="Month"> <a class="Jan">Jan</a> <a class="Feb">Feb</a> <a class="Mar">Mar</a> <a class="Apr">Apr</a>

我的html：

<a id="Year2016">2016</a>

<div class="Month">
        <a class="Jan">Jan</a>
        <a class="Feb">Feb</a>
        <a class="Mar">Mar</a>
        <a class="Apr">Apr</a>
        <a class="May">May</a>
        <a class="Jun">Jun</a>
        <a class="Jul">Jul</a>
        <a class="Aug">Aug</a>
        <a class="Sep">Sep</a>
        <a class="Oct">Oct</a>
        <a class="Nov">Nov</a>
        <a class="Dec">Dec</a>
</div>

我的代码将所有类更改为2016年1月，而我只是尝试将2016添加到每个类的末尾。我一直在乱搞$。每个函数来解决这个问题，但我无法正确使用它

更新：有人删除了这个答案，但这个也可以

$("#Year2016").click(function() {
    $('.Month a').each(function(){ 
        $(this).attr("class", $(this).attr('class') + "2016");
    });
});

我想他想把这一年加到月底。那么

$(document).ready(function(){
    $("#Year2016").click(function() {
        $('.Month').children('a').each(function () {
        var newVal = this.text+" 2006";
        this.text = newVal;
        });
    });
});

输出：

2006年1月2006年2月2006年3月2006年4月2006年5月2006年6月2006年7月2006年8月2006年9月2006年10月2006年11月2006年12月

这应该会起作用。。。如果你还需要什么，请告诉我

//HTML

<!DOCTYPE html>
<html>
<head>
<script src="index.js"></script>
</head>
<body>
    <button onclick="addYear();">2016</button>
    <div id="year">
        <a class="Jan">Jan</a>
        <a class="Feb">Feb</a>
        <a class="Mar">Mar</a>
        <a class="Apr">Apr</a>
        <a class="May">May</a>
        <a class="Jun">Jun</a>
        <a class="Jul">Jul</a>
        <a class="Aug">Aug</a>
        <a class="Sep">Sep</a>
        <a class="Oct">Oct</a>
        <a class="Nov">Nov</a>
        <a class="Dec">Dec</a>
    </div>  
</body>
</html>

//JS index.JS

function addYear(){
    var year = document.getElementById("year");
    var months = year.children;
    for(var i=0; i < months.length; i++){
        var month = months[i].className;
        var addYear = month.concat("2016");
        months[i].setAttribute("class", addYear);
    }
}

可以使用为集合中的每个元素设置类，例如：

$('.Month a').attr('class', function(idx, val) { 
    return val + '2016';
});

注意：如果您有多个课程，2016将附加到最后一个课程，例如：

<a class="Jan example"> --> <a class="Jan example2016">

从你的描述来看，你目前的方法似乎相当复杂。我个人会用一个简单的MVVM库来处理整个问题。一个很好的例子是。将数据和显示逻辑分开保存可以避免不必要地来回移动信息

var v=新的Vue{ el:‘vue’，数据：{ 年份：[2014年、2015年]，索引：0，月份：[一月、二月、三月、四月、五月、六月、，七月、八月、九月、十月、十一月、十二月] }, 方法：{ 选择：功能i{ 该指数=i； }, foo：函数{ 变量i=此$$.select.selectedIndex；警报“获取”+这个.month[i]+这个.years[this.index]； } } }; a{ 利润率：0.5px； } {{月}{{年[索引]} 下载

@ShifarShifz哈哈。。。给我一秒钟，我会告诉你，听起来你做了一些根本错误的事情，你为什么要这样做？不管你在做什么，听起来都有一个更简单的方法。@Nit也许。。。这比我想象的要复杂，哈哈。我有24个pdf文件，有两年的日历，我认为逐月显示会很酷，而不仅仅是两个12页的pdf文件。但是为什么你需要创建这样的类？@Nit我正在尝试让类名与文件名对应。我的下一个函数使用类名加载正确的文件谢谢，我会检查这个！

<a class="Jan example"> --> <a class="Jan example2016">