第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機(jī)立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

抓取elementID

抓取elementID

泛舟湖上清波郎朗 2022-01-07 21:11:02
我正在創(chuàng)建一個帶有 td id 的表,如下所示(id=concatenate(row,column)):function createTable() {  document.body.innerHTML += '<table border="1" id="mytable"></table>';  for (var i = 0; i < 4; i++) {    document.getElementById("mytable").innerHTML += '<table border="1"><tr id="row' + i + '"></tr></table>';    for (var k = 0; k < 4; k++) {      document.getElementById("row" + i).innerHTML += '<td id=' + i + k + '></td>';    }  }}然后我想根據(jù)每個單元格的值是 >5 還是以下來更改每個單元格的背景顏色。這是我為每個單元格調(diào)用的 onclick 函數(shù):function clickable() {  var table = document.getElementById("mytable");  if (table != null) {    for (var i = 0; i < table.rows.length; i++) {      for (var j = 0; j < table.rows[i].cells.length; j++)      table.rows[i].cells[j].onclick = function () { colorChange(i, j); };    }  }}function colorChange(i, j) {  if (document.getElementById("" + i + j).innerHTML > 5) {    document.getElementById("" + i + j).style.backgroundColor = "green";  }}但是調(diào)試器在嘗試訪問 colorChange 的第一行中的 null 屬性時捕獲了一個 typeError,這意味著我獲取 elementID 的方法是錯誤的。獲取元素 ID 的正確方法是什么?
查看完整描述

2 回答

?
楊魅力

TA貢獻(xiàn)1811條經(jīng)驗(yàn) 獲得超6個贊

這是因?yàn)槟鷮?vars 用于循環(huán)變量,點(diǎn)擊時您總是有 i=4 和 j=4 。只需用 let 替換它們:


function clickable() {

  var table = document.getElementById("mytable");

  if (table != null) {

    for (let i = 0; i < table.rows.length; i++) {

      for (let j = 0; j < table.rows[i].cells.length; j++)

      table.rows[i].cells[j].onclick = function () { colorChange(i, j); };

    }

  }

}


查看完整回答
反對 回復(fù) 2022-01-07
?
九州編程

TA貢獻(xiàn)1785條經(jīng)驗(yàn) 獲得超4個贊

您不需要任何i和j業(yè)務(wù)。只需直接選擇單元格元素并循環(huán)遍歷它們以添加事件偵聽器,使用querySelectorAll,按照下面的演示。


注意你提到你想“改變每個單元格的背景顏色取決于它的值是> 5還是低于” ......但是你如何定義“值”?目前還不清楚。在 colorChange 函數(shù)中,您嘗試使用單元格的“innerHTML”測試值,但您的單元格無論如何都沒有任何內(nèi)容,因此它永遠(yuǎn)不會工作。


因此,對于演示的目的,我以為你打算填充細(xì)胞的價值觀i和k,然后解釋這些作為一個單一的數(shù)字,當(dāng)你做colorChange測試。


也<table border="1">需要刪除。您不能在另一個表中直接擁有一個表。無論如何,這不是必需的。


function createTable() {

  document.body.innerHTML += '<table border="1" id="mytable"></table>';

  for (var i = 0; i < 4; i++) {

    document.getElementById("mytable").innerHTML += '<tr id="row' + i + '"></tr></table>';

    for (var k = 0; k < 4; k++) {

      document.getElementById("row" + i).innerHTML += '<td id=' + i + k + '>' + i + k + '</td>';

    }

  }

}


function clickable() {

  var cells = document.querySelectorAll("#mytable td");

  cells.forEach(function(cell) {

    cell.addEventListener("click", colorChange);

  });

}


function colorChange() {

  console.log(this.innerHTML);

  if (this.innerHTML > 5) {

    this.style.backgroundColor = "green";

  }

}


createTable();

clickable();

有關(guān)文檔,請參閱https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelectorAll。


查看完整回答
反對 回復(fù) 2022-01-07
  • 2 回答
  • 0 關(guān)注
  • 400 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號