Question

我正在尝试从我的HTML代码中选择一个元素，然后在JavaScript中使用它（需要突出显示）。 HTML包含一个36 td的表。

到目前为止我的代码：

var box;
function getRandom()
{
    return (Math.floor(Math.random()*37))
}
function highlight()
{
    box = document.getElementById(getRandom());
    box.style.backgroundColor = "yellow";
}

如果有人能给我任何指示，我们将不胜感激。我知道使用jQuery很容易，但我还没有开始学习。编辑：HTML代码的摘录，这可以达到name =“36”。

<table id="reflexTable">
    <tbody>
    <tr>
      <td name="1"></td>
      <td name="2"></td>
      <td name="3"></td>
      <td name="4"></td>
      <td name="5"></td>
      <td name="6"></td>
    </tr>

Answer 1

getElementById获取具有匹配id的元素。您的表数据单元格根本没有ID。它们有一个名称，但HTML不允许这样做。

切换到id。

HTML 4不允许id以数字开头。使用公共字符串前缀id。然后：

document.getElementById("foo" + getRandom());

Answer 2

一种不涉及设置元素ID的更好方法：

function highlight() {

    // get all TDs that are descendants of table#reflexTable:
    var tds = document.getElementById('reflexTable').getElementsByTagName('td');

    // get a random int between 0 (inclusive) and tds.length (exclusive)
    var rand = Math.floor( Math.random() * tds.length );

    // highlight td at that index
    tds[rand].style.backgroundColor = "yellow";

}

此方法的最大优点是您可以根据需要添加/删除尽可能多的TD，而无需编辑JS以生成有效的随机数。

Answer 3

您没有设置id属性，而是设置name属性，将其更改为：

<td id="1"></td>

...等

Answer 4

有几件事：

您应该在突出显示功能中声明框变量。
您必须将该随机数转换为字符串。
Quentin提到了一些重要的事情 - 你应该给每个表元素一个 id ，比如“s0”，“s1”，“s2”等......
从0开始命名，因为你的getRandom函数有时会返回它。

function highlight（）{ var数; number = getRandom（）。toString（）; var box; box = document.getElementById（“s”+ number）; box.style.backgroundColor =“yellow”; }

仅使用JavaScript选择随机HTML元素

4 个答案: