如何使用jQuery獲取頁面加載元素的ID

Question

我只是知道如何獲取被點擊元素的ID，就像這樣：

$("button").click(function(){
console.log($(this).attr("id"));
}

但是如何獲取網頁加載ID？ 看這個..

$("button").ready(function(){
console.log($(this).attr("id"));
}

它返回整個文檔對象和一個..

$("button").load(function(){
console.log($(this).attr("id"));
}

根本什么也沒做。

我想動態更改加載時所有按鈕的樣式。

主項目更加復雜，我不想使用js核心來實現它，我想要jQuery選擇器的簡單性，但是可以使用等效的js方法。

Answer 1

我想動態更改加載時所有按鈕的樣式。

如果是這種情況，您只需在加載時將css應用於button選擇器，而無需獲取每個按鈕的id 。

$(function() {
    $("button").css("background-color", "#C00");
});

或者更好的方法是，將css樣式放入類中，然后將類應用於所有按鈕：

$(function() {
    $("button").addClass("red-bg");
});

如果確實要獲取加載時每個按鈕的id ，則需要使用一個數組來滿足可能存在多個按鈕的事實：

var buttonIds = $("button").map(function() {
    return this.id;
}).get();

但是，這是一個毫無意義的方法，因為您可以只使用each()遍歷button選擇器來訪問每個單獨的按鈕元素。

Answer 2

您可以在jquery中獲取所有按鈕元素，然后在每個按鈕元素上循環以更改其樣式-：

$(function()
{
    var allButtons = $('button');
    $.each(allButtons,function(index,element)
    {
        $(element).css('width','100px');
    });
});

Answer 3

我認為您正在尋找這個：

        $(document).ready(function () {
            $(":button").each(function () {
                console.log($(this).attr("id"));
            })
        });