Я пытаюсь подготовить свой первый скрипт Greasmonkey (без опыта работы с технологиями javascript / вебсайтов), и у меня проблема с выбором поля на странице. Это:
<input data-testid="user/fullName" autocomplete="name" class="form-control u-text-normal">
Я проверил:
document.querySelectorAll("input.form-control");
document.querySelectorAll("input.form-control.u-text-normal");
document.getElementById("user/fullName").value
но ни один из них не возвращает то, что мне нужно ... и что мне нужно, так это возможность заполнить поле формы скриптом. Не могли бы вы помочь, пожалуйста?
РЕДАКТИРОВАТЬ: методы, приведенные в следующих ответах, я пытаюсь запустить в консоли браузера, и они не возвращают мне ни одного элемента. Может быть, кто-то может попытаться запустить его и сказать мне, что я делаю не так? Веб-сайт представляет собой корзину для покупок на сайте пиццы :) Но чтобы увидеть ее, вам нужно добавить пиццу в корзину («Do koszyka») минимум на 20 злотых, а затем перейти к оплате («Do kasy»). Тогда первое поле «Imie i nazwisko» - это то, что я хотел бы заполнить в начале.
Всего 5 ответов
Если вам нужно получить один элемент, дайте элементу html пример id:
<html>
<input id='id_here'data-testid="user/fullName" autocomplete="name" class="form-control u-text-normal">
</html>
затем получить элемент с помощью
document.getElementById('id_here');
Для нескольких элементов, которые используют один и тот же класс, вы можете использовать селектор запросов
document.querySelector('.form-control')
Это то, что вы хотели?
var example = document.querySelector('.form-control').value; document.write(example);
<input data-testid="user/fullName" autocomplete="name" class="form-control u-text-normal" value="test">
Если вы хотите выбрать только этот элемент, используйте наиболее конкретную вещь, в данном случае data-testid
:
var x = document.querySelectorAll("[data-testid='user/fullName']")
console.log(x[0].value)
выбрать элемент (здесь мы выбираем класс и свойство данных, чтобы быть наиболее точным) =>
var element = document.querySelector('.form-control[data-testid="user/fullName"]');
После, если вы хотите добавить некоторое значение в этот вход =>
element.value = "My_value";
С уважением
Вы можете добавить 'id' или выбрать свое поле по querySelector
let input = document.querySelector('[data-testid="user/fullName"]') input.value='abc'; myField.value += '123';
<input id="myField" data-testid="user/fullName" autocomplete="name" class="form-control u-text-normal">
Обновить
Я пробую свой метод, и он работает на сайте пиццы, который вы упоминаете в своем обновлении вопроса:
Но похоже, что консоль «видит» элемент ввода dom после того, как вы нашли его, используя right click> inspect element
- странно