Javascript：一次調用中有多個GetElementByID

Question

真的很簡單的問題。 我有以下代碼，並希望盡可能地將其合並。 無法讓它工作但嘗試使用逗號等。有沒有辦法在GetElementByID方法中調用多個ID？ Javascript新手：/

$("#set50").live("click", function() {
    document.getElementById("statusBox50").setAttribute("class", "statusBoxSelected");
    document.getElementById("statusBox25").setAttribute("class", "statusBox");
    document.getElementById("statusBox75").setAttribute("class", "statusBox");
    document.getElementById("statusBox100").setAttribute("class", "statusBox");
    $(".statusbar").animate({
        width: '115px'
    }, 500);    
});

Answer 1

不，但是既然你正在使用jQuery，你可以使用它。 這會將statusBox類添加到ID為statusBox25 ， statusBox75和statusBox100 ：

$("#statusBox25, #statusBox75, #statusBox100").addClass('statusBox');

或者，如果要刪除所有現有類並使用statusBox替換它們，就像執行原始代碼一樣，可以使用：

$("#statusBox25, #statusBox75, #statusBox100").attr('class', 'statusBox');

Answer 2

有沒有辦法在GetElementByID方法中調用多個ID？

不，它是Id（小寫d）

並且不要使用setAttribute ，除了IE的最新版本之外，它都被破壞了。

你正在使用jQuery，所以你可以使用它的輔助函數：

jQuery('#statusBox50').addClass('statusBoxSelected');
jQuery('#statusBox25, #statusBox75, #statusBox100').addClass('statusBox');

Answer 3

你應該可以這樣做：

$("#set50").live("click", function() {
    $("#statusBox50").addClass("selected");
    $("#statusBox25, #statusBox75, #statusBox100").removeClass("selected");
    $(".statusbar").animate({...});
});

請注意，我正在做一些與您不同的事情：我有一個“已選擇”的類，我應用或刪除，而不是設置 [statusBoxSelected | statusBox]的類。 這可能是class =“statusBox”的補充。

我還建議您查看其他不會像這樣硬編碼ID的方法。 例如：

$(".set50").live("click", function(evt) {
    $('.statusBar').removeClass("selected");
    $('#statusBar50').addClass("selected");
});

你甚至可以走得更遠，並在“set”元素上有一個屬性，其中包含狀態欄應該設置的數量。

或者考慮使用HTML5進度條，以及一些墊片在不支持的瀏覽器中執行相同操作。

Answer 4

$("#set50").live("click", function() {
    $("statusBox50").addClass("statusBoxSelected");
    $("statusBox25").addClass"statusBox");
    $("statusBox75").addClass( "statusBox");
    $("statusBox100").addClass( "statusBox");
    $(".statusbar").animate({
        width: '115px'
    }, 500);    
});

這是你想要的嗎？

.addClass為所選元素添加一個類。[ docs ]

編輯 ：正如你所說，你想要一個單一的。 只需為要添加類的所有元素分配一個類。 例如：我指定類adding 。 那么你可以添加類到這樣的所有元素：

$('.adding').addClass('statusBox')