無法選擇使用javascript創建為模板的html元素

Question

我用java腳本創建了一個表，該表包含行和列，基本上是座位的模板，但是當我嘗試使用document.getELementbyclassname選擇html元素時，卻無法定義。 我正在使用每個in j查詢$(document).ready(function) ，但我仍然不確定。

function createTemplate(rows,cols){
    var rows = rows; 
    var col = cols; 


    for(var i = 0; i < rows; i++){
       $("#container").append("<div class = 'row rower'></div>");
    }
    for(var y = 0; y < col; y++){
        $(".rower").append("<div class = 'col-xs-1 cols'> </div>");
    }
    for(var z = 0; z < 1; z++){
        $(".cols").append("<button class = 'btn btn-danger proness'></button>"); 
    }

    var buttons = document.getElementsByClassName("proness");
    for(var l = 0; l < buttons.length; l++){
        buttons[l].innerHTML = l; 
    }


    var row = document.getElementsByClassName("rower"); 
    for(var x = 0; x < row.length;x++)
    {
        row[x].style.padding = "1px"; 
    }  

}; 

現在，我用完之后

var button = document.getElementByClassName("btn"); 
console.log(button[3]); // UNdefined 

Answer 1

由於您已經在使用jquery，因此可以使用jquery來處理按鈕。

小提琴： https ： //jsfiddle.net/j6ju2cxs/

var buttons = $(".btn");
console.log($(buttons[3]).html());

如果輸入到函數中的行和列所導致的單元格數目少於3，則尋找button [3]將返回未定義。