Javascript JS使用通配符创建数组

因此，我有一个HTML网格，其中每个框都使用以下约定进行标记。每个框都有一个ID，标记为行\列。我想创建一个方法来扫描文档并返回一个数组，该数组只包含具有特定列号的框。例如，如果我调用下面的函数，它应该返回一个框数组，如果我用数字2调用它，它将返回（1_2、2_2、3_2和4_2）

在此基础上，我将使用该函数以以下方式在另一个函数中创建数组：

function test(){
    var boxes = getBoxesByColumn(1);
    console.log(boxes);

但是，当我调用控制台时，它只打印空值。为什么呢

编辑：

我的HTML示例（包含另外两行）

---

Alex

您可以使用

.queryselectoral（）

，属性以选择器开头，后代选择器以选择器结尾

函数getBoxesByColumn（columnNumber）{ return document.querySelectorAll（“div[id^=row]>div[id$='”+columnNumber+“']”）； } console.log（getBoxesByColumn（2））

您可以使用

.queryselectoral（）

，属性以选择器开头，子代选择器以选择器结尾

函数getBoxesByColumn（columnNumber）{ return document.querySelectorAll（“div[id^=row]>div[id$='”+columnNumber+“']”）； } console.log（getBoxesByColumn（2））

简单地说，您需要做的是找到id为列号的所有div，然后迭代它们以找到所需的给定数字

function getBoxesByColumn(columnNumber){
    var elems = document.getElementsByTagName('div'); // Get all divs
    var arr = [];
    for(i in elems){ // Iterate all elems
        // Check if element contains the column number
        if(elems[i].id 
        && elems[i].id.indexOf(columnNumber) != -1 
        && elems[i].id.indexOf('row') == -1){
            arr.push(elems[i]) // Push the element to the arr
        }
    }
    return arr; // Return arr
}

---

简单地说，您需要做的是找到id为列号的所有div，然后迭代它们以找到所需的给定数字

function getBoxesByColumn(columnNumber){
    var elems = document.getElementsByTagName('div'); // Get all divs
    var arr = [];
    for(i in elems){ // Iterate all elems
        // Check if element contains the column number
        if(elems[i].id 
        && elems[i].id.indexOf(columnNumber) != -1 
        && elems[i].id.indexOf('row') == -1){
            arr.push(elems[i]) // Push the element to the arr
        }
    }
    return arr; // Return arr
}

---

请单击编辑器中的

按钮并提供一个。请与我们共享您的html。添加htmlIt非常简单，但您几乎可以肯定，最好给这些孩子

div

一个类（或者使用

框\u empty

，如果可靠的话）然后在他们的父母身上使用

Element#queryselectoral

。基本上，我正在尝试重新创建2048游戏。box_empty类用于控制颜色，v类是每个框中的值。你是不是建议每个盒子都有第二个不同的等级？如果每个类都有一个唯一的值，那么拥有一个类有什么意义呢？请单击编辑器中的

按钮并提供一个类。请与我们分享您的html。添加htmlIt非常简单，但您几乎肯定最好给这些孩子

div

一个类（如果可靠，可使用

框\u empty

）然后在它们的父对象上使用

Element#querySelectorAll

。基本上，我正在尝试重新创建2048游戏。长方体的空类用于控制颜色，v类是每个长方体中的值。您是否建议每个长方体div使用第二个不同的类？如果每个长方体div都有一个uniq，则使用类有什么意义ue值？只需去掉

div

这不是所有CSS选择器所必需的，这里有一个注意事项，如果预期结果实际上是一个数组，则将

.queryselectoral（）

传递到

数组。from（）

@ibrahimmahrir“只需去掉

div

这不是必需的”，尽管用于特殊性。@alexp2603

“div[id$=”+columnNumber+“']：不（[id^='row']）“

应该可以！检查这个。它有所有CSS选择器的引用！只需去掉

div

它不是所有CSS选择器都需要的，这里有一个注意事项，如果预期结果实际上是一个数组，请将

.queryselectoral（）

传递到

array.from（）

@ibrahimmahrir“只需去掉

div

It's not nexed”虽然用于特殊性，但不是必需的。@alexp2603

“div[id$=''.''.'++columnNumber+']：不（[id^='row']）”

应该这样做！检查此项。它有所有CSS选择器的引用！

function getBoxesByColumn(columnNumber){
    var elems = document.getElementsByTagName('div'); // Get all divs
    var arr = [];
    for(i in elems){ // Iterate all elems
        // Check if element contains the column number
        if(elems[i].id 
        && elems[i].id.indexOf(columnNumber) != -1 
        && elems[i].id.indexOf('row') == -1){
            arr.push(elems[i]) // Push the element to the arr
        }
    }
    return arr; // Return arr
}