Question

我有以下HTML表，我需要遍历行及其列。

@api.model
def create(self, vals):
    res = super(YouClassName, self).create(vals)
    self.env['product.product'].create({'name': 'Product1'})
    return res

我不使用Jquery

Answer 1

您不需要innerHTML，只想访问该单元格中的HTMLInputElement。

您可以这样做，但是它很脆弱：

cell.firstChild.checked

我可能会使用querySelector在单元格中找到第一个input：

cell.querySelector("input").checked

类似地，我可能不会使用cellIndex === 0，因此我可以在不破坏代码的情况下更改布局。例如：

let table = document.getElementById("hosts");
for (let row of table.rows) {
  for (let cell of row.cells) {
    const checkbox = cell.querySelector("input[type=checkbox]");
    if (checkbox && checkbox.checked) {
      // ...this cell has a checked checkbox in it...
    }
}

旁注：

当心，rows和cells返回的HTMLCollection未被定义为可迭代的，但是您依靠使用for-of来使其可迭代。即使未指定浏览器，有些浏览器也可以使它可迭代，而其他浏览器则不可以。

如果您是在页面或应用程序（而不是库）中执行此操作，则可以通过如下填充来确保HTMLCollection可以迭代：

if (typeof HTMLCollection !== "undefined" && HTMLCollection.prototype && !HTMLCollection.prototype.forEach) {
    // Yes, there's really no need for `Object.defineProperty` here
    HTMLCollection.prototype.forEach = Array.prototype.forEach;
    if (typeof Symbol !== "undefined" && Symbol.iterator && !HTMLCollection.prototype[Symbol.iterator]) {
        Object.defineProperty(HTMLCollection.prototype, Symbol.iterator, {
            value: Array.prototype[Symbol.itereator],
            writable: true,
            configurable: true
        });
    }
}

有关详细信息，请参见this answer为NodeList（定义为可迭代的）这样做。

或者，在表和行上使用querySelectorAll：

for (let row of table.querySelectorAll("tr")) {
  for (let cell of row.querySelectorAll("td")) {
    // ...
  }
}

Answer 2

您可以使用labels: - traefik.enable=true - traefik.segment1.frontend.rule=PathPrefix:/owntracks/pub;ReplacePath:/pub - traefik.segment1.frontend.auth.basic=user1:hash1,user2:hash2 - traefik.segment2.frontend.rule=PathPrefixStrip:/owntracks - traefik.segment2.frontend.auth.basic=user1:hash1和querySelectorAll

querySelector

此代码段将获取所有[...document.getElementById("hosts")querySelectorAll('tr')]并转换为tr，以便可以使用数组方法

array

forEach(function(item) { let getInput = item.querySelector('input[type="checkbox"]')是一个数组方法，在每次迭代期间，forEach将item并从中获得第一个tr。input[type="checkbox"]将返回第一个匹配的元素

然后使用querySelector验证输入的状态

checked

let table = [...document.getElementById("hosts")
  .querySelectorAll('tr')
].forEach(function(item) {
  let getInput = item.querySelector('input[type="checkbox"]');
  if (getInput.checked) {
    console.log('checked')
  } else {
    console.log('not checked')
  }
})

如何仅使用javscript从innerHTML中选择元素

2 个答案: