Веб-страница не ведет себя так, как будто флажки установлены после манипулирования в консоли

Question

Извините за мою ограниченную способность формулировать вопрос. Мне нужно установить 100 флажков, чтобы применить правило учета к 100 банковским записям (в FreeAgent). В консоли в Google Chrome я набрал следующее, что успешно проверяет первое поле в списке. (Как только это сработает, я положу его в al oop, чтобы он проверял их все, но я еще не дошел до этого.)

var x = document.getElementsByClassName('FormElement-checkbox');
x[1].firstElementChild.checked = true;

Когда я пытаюсь продолжить процедуру, веб страница не «осознает», что флажки были отмечены. Я могу заставить его работать только в том случае, если я физически нажимаю флажки по отдельности на странице - тот факт, что они отображаются отмеченными, не имеет значения для страницы. Так что, очевидно, что-то мне не хватает.

Я могу успешно вводить текст в поля и выбирать элементы в выпадающих списках. Я попытался проверить элемент checkbox и посмотреть, что происходит, когда он проверяется, нажав на него, но я не вижу никакой разницы в HTML. Я исследовал множество атрибутов в javascript для этого объекта, когда набирал

x;

, и именно таким образом я нашел .firstElementChild.checked = true во-первых.

Я не знаю, является ли это чем-то конкретным c для самой страницы или вообще у меня недостаточно опыта, чтобы иметь возможность решать все ситуации ввода данных. Я пытался искать ответы на этом форуме и в других местах.

Answer 1

Это происходит, скорее всего, из-за некоторой хитрости JS / CSS - элементы слушают событие click, а не изменяют свойство HTML. Попробуйте поднять событие .click

var cbs = document.getElementsByClassName("FormElement-checkbox")

for (var i = 0; i < cbs.length; i++){
    cbs[i].click()
 }

Answer 2

Попробуйте:

var x = document.getElementsByClassName('FormElement-checkbox');
var result = "document.getElementsByClassName('FormElement-checkbox')";
  for (var i=0, len=x.length|0; i<len; i=i+1|0) {
  result += "\n  " + x[i].textContent;
   }

Вы также можете попробовать:

document.querySelector(".FormElement-checkbox") 

, чтобы получить первый элемент с именем_класса (или)

document.querySelectorAll(".FormElement-checkbox") 

чтобы получить список элементов с именем_класса

Вы можете найти все о Document.getElementsByClassName () здесь по этой ссылке

Answer 3

Вы пробовали что-то вроде этого:

var x = document.getElementsByClassName('FormElement-checkbox')
x[0].checked = true;

или использовали метод click() для элемента-флажка.

Часть документа HTML может быть полезна.