如何检查表td的值

How to check value of table td?

本文关键字:的值 td 检查表      更新时间:2023-09-26

我正在尝试创建雷场游戏。"我对Js很陌生"。

到目前为止我做了什么:

var level = prompt("Choose Level: easy, medium, hard");
if (level === "easy") {
    level = 3;
} else if (level === "medium") {
    level = 6;
} else if (level === "hard") {
    level = 9;
}
var body = document.getElementsByTagName("body")[0];
var tbl = document.createElement("table");
var tblBody = document.createElement("tbody");
for (var i = 1; i <= 10; i++) {
    var row = document.createElement("tr");
    document.write("<br/>");
    for (var x = 1; x <= 10; x++) {
        var j = Math.floor(Math.random() * 12 + 1);
        if (j < level) {
            j = "mined";
        } else {
            j = "clear";
        }
        var cell = document.createElement("td");
        var cellText = document.createTextNode(j + " ");
        cell.appendChild(cellText);
        row.appendChild(cell);
    }
    tblBody.appendChild(row);
}
tbl.appendChild(tblBody);
body.appendChild(tbl);
tbl.setAttribute("border", "2");

所以我在这里创建了2d表,并在行和列中输入2个随机值(挖掘或清除)。

我被卡住的地方是:

检查是否td = mined,否则打开box(td)等。

我如何分配的td?我的意思是我怎么能检查哪个值(挖掘/清除)有在点击的td ?

Ps:请不要写完整的代码:)请给我看一下曲目:)

谢谢你的回答!

Ok !我走了这么远…但如果我点击行,它有时会显示清楚,即使我点击已挖掘的行,反之亦然!

  // create the table
  var body = document.getElementsByTagName("body")[0];
  var tbl     = document.createElement("table");
  tbl.setAttribute('id','myTable');
  var tblBody = document.createElement("tbody");

  //Create 2d table with mined/clear
  for(var i=1;i<=10;i++)
     {
   var row = document.createElement("tr");
    document.write("<br/>" );
for(var x=1;x<=10;x++)
{
 var j=Math.floor(Math.random()*12+1);
 if(j<level)
 {
 j = "mined";
 }
 else{
 j = "clear";
 }
 var cell = document.createElement("td");
  var cellText = document.createTextNode(j + "");
  cell.appendChild(cellText);
  row.appendChild(cell);
}
  tblBody.appendChild(row);
     }
     tbl.appendChild(tblBody);
      body.appendChild(tbl);
     tbl.setAttribute("border", "2");

  //Check which row is clicked
     window.onload = addRowHandlers;
function addRowHandlers() {
var table = document.getElementById("myTable");
var rows = table.getElementsByTagName("tr");
for (i = 0; i < rows.length; i++) {
    var currentRow = table.rows[i];
    var createClickHandler = 
        function(row) 
        {
            return function() { 
                 var cell = row.getElementsByTagName("td")[0];
                 var id = cell.innerHTML;
              if(id === "mined")
              {
              alert("You died");
              }else
              {
              alert("clear");
              }
              };
        }
    currentRow.onclick = createClickHandler(currentRow);
           }
           }

我想我做错了给表id "myTable".

你能看见吗?

提前感谢!

所以,我们的想法是:

  1. 为每个td单元格分配一个click事件:

    td.addEventListener('click', mycallback, false);

  2. 在事件处理程序(回调)中,检查td的内容:

    function mycallback(e) { /*e.target is the td; check td.innerText;*/ }

教师资源:

  • https://developer.mozilla.org/en-US/docs/Web/HTML/Element/td?redirectlocale=en-US& redirectslug = HTML % 2 felement % 2 ftd

  • https://developer.mozilla.org/en-US/docs/DOM/EventTarget.addEventListener
  • JavaScript,获取id为

  • 的td的值