Выбор поля формы на html-странице - PullRequest
Новая
       1

Выбор поля формы на html-странице

2 голосов
/ 17 мая 2019

Я пытаюсь подготовить свой первый скрипт Greasmonkey (без опыта работы с технологиями javascript / вебсайтов), и у меня проблема с выбором поля на странице.Это:

<input data-testid="user/fullName" autocomplete="name" class="form-control u-text-normal">

Я проверял:

  1. document.querySelectorAll("input.form-control");
  2. document.querySelectorAll("input.form-control.u-text-normal");
  3. document.getElementById("user/fullName").value

но ни один из них не возвращает то, что мне нужно ... и мне нужна возможность заполнить это поле формы скриптом.Не могли бы вы помочь, пожалуйста?

РЕДАКТИРОВАТЬ: методы, приведенные в следующих ответах, я пытаюсь запустить в консоли браузера, и они не возвращают мне ни одного элемента.Может быть, кто-то может попытаться запустить его и сказать мне, что я делаю не так?Веб-сайт представляет собой корзину для покупок на сайте пиццы :) Но чтобы увидеть ее, вам нужно добавить пиццу в корзину («Do koszyka») минимум на 20 злотых, а затем перейти к оплате («Do kasy»).«).Тогда первое поле «Imie i nazwisko» - это то, что я хотел бы заполнить в начале.

Ответы [ 5 ]

0 голосов
/ 17 мая 2019

для выбора элемента (здесь мы выбираем класс и свойство данных, чтобы быть наиболее точными) => 

var element = document.querySelector('.form-control[data-testid="user/fullName"]');

После, если вы хотите добавить какое-либо значение в этот вход => 

element.value = "My_value";

С уважением

0 голосов
/ 17 мая 2019

Вы можете добавить '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">

Обновление

Я пробую свой метод, и он работает пицца сайт, который вы упоминаете вобновление вашего вопроса:

enter image description here

Но похоже, что консоль "видит" элемент ввода dom после того, как вы найдете его с помощью right click> inspect element - странно

0 голосов
/ 17 мая 2019

Это то, что вы хотели? 

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">
0 голосов
/ 17 мая 2019

Если вы хотите выбрать только этот элемент, используйте наиболее конкретную вещь, в данном случае data-testid: 

var x = document.querySelectorAll("[data-testid='user/fullName']")
console.log(x[0].value)
0 голосов
/ 17 мая 2019

Если вам нужно получить один элемент, дайте 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')
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...