首页 > 解决方案 > 选择/选中 td 类中的第一个复选框?

问题描述

我目前正在尝试找出一种方法来选择在页面上具有以下 HTML 的第一个复选框(我不确定它在技术上是否是单选按钮)(http://www.swagbucks.com/polls) :

<td class="pollCheckbox"></td>

我一直在使用以下代码来尝试选择页面上 4 个复选框的第一个复选框:

// ==UserScript==
// @name         SBPollSelectv2
// @version      1.0
// @description  Demonstration script to change form values
// @include      *
// @grant        none
// ==/UserScript==

var tds = document.getElementsByTagName("td");
for (var i = 0; i<tds.length; i++) {

  // If it currently has the pollCheckbox class
  if (tds[i].className == "pollCheckbox") {
    // Select first button
    document.getElementsByClassName("pollCheckbox")[0].checked = true;
  }
}

我相信最后一行代码是缺陷所在。我可以通过标签选择所有的TD元素,然后尝试按类排序。然后我需要选择给定类的第一个复选框。不幸的是,我的代码不起作用。我需要弄清楚如何选择具有类名的第一项,然后选择该复选框。任何和所有的帮助都会很棒。

标签: javascriptgreasemonkeyradiouserscriptstampermonkey

解决方案


它们实际上不是复选框或单选按钮 - 它们<td>的样式看起来像单选按钮,因此分配给.checked将不起作用。相反,调用你想要click()td,站点的 JS 将使它看起来被选中:

document.querySelector('td.pollCheckbox').click();

包含该单行代码的用户脚本将使第一个 td 显示为选中。

因为您只想选择第一个 td相似的单选按钮,所以不需要循环,您可以只使用querySelector返回与选择器字符串匹配的第一个元素。


推荐阅读