Как регуляркой на JS вытащить определённый текст с открытой страницы?

Question

[andreystrelkov]

Добрый день, у меня со страницей грузится дополнительный JavaScript файл, мне нужно сделать так, чтобы при его выполнении он спарсил содержимое текущей страницы и вытащил от туда какое нибудь текстовое значение

Допустим если бы это был сайт тостер, где я авторизован, в html коде можно найти такую строку

<a class="user-panel__user-name" href="https://toster.ru/user/andreystrelkov">
          andreystrelkov        </a>

мне JS нужно вытащить andreystrelkov

как я понимаю нужно копать в document.match, но не уверен

Comments

[Алексей Уколов]

Что значит "вытащил"? Если вы итак знаете, что вам нужен текст "andreystrelkov", зачем его вытаскивать?
Или вам нужно проверить его наличие на странице?
Или текст у вас формируется динамически? Если да, то по каким правилам?

[Евгений]

Согласен с Алексей Уколов Нужно больше инфы.

[andreystrelkov]

Алексей Уколов: Динамически, мне нужно тащить авторизованного пользователя, и ещё другой текстовый параметр

[Алексей Уколов]

andreystrelkov: с любой страницы или с какой-то конкретной?
Регулярные выражения, знаете ли, регулярные, это не магия. Если вы не можете задачу описать конкретными словами, каким-то одинаковым алгоритмом, значит на регулярных выражениях ее не решить.

Answer 1

[Igor Kravchenko]

даже без jQuery

var text = document.querySelector(".user-panel__user-name").innerText;

Comments

[robotcigan]

оно найдет только первое совпадение

[Igor Kravchenko]

robotcigan: по этому есть querySelectorAll

[andreystrelkov]

Большое спасибо! Как всё просто оказывается, однако возникла одна проблемма, у меня данный код подгружается как файл (как и все остальные JS файлы), и при открытии страницы, код выполняется раньше, потому не работает и ругается что не может найти такие классы/id-шники

Возникла проблемма, что нужно выполнять код после загрузки всего кода. Погуглил и нагугли https://javascript.ru/blog/gordon-freeman/Vypolnen... т.е. через window.onload, однако это не принесло результата, правильно ли я понимаю, что это помогает только тогда, когда код в самой html находится

[Igor Kravchenko]

andreystrelkov: почитай здесь https://learn.javascript.ru/onload-ondomcontentloaded

Answer 2

[Сергей Иванов]

/\<a(.*)andreystrelkov(.*)\>/g
На сколько помню

Answer 3

[Andrew]

var str = '<a class="user-panel__user-name" href="https://toster.ru/user/andreystrelkov">   andreystrelkov        </a>';
      if (str.match(/\/user\/(\w+)\"/)) { uName = RegExp.$1};
      console.log(uName);

P.S.: для любителей jQuery: не забывайте про $.trim того что вы дергаете, иначе будет переменная аля:

uName = "         andreystrelkov        "; // с кучей пробелов и прочих табуляций по бокам

Answer 4

[robotcigan]

Может я немного не понял вопроса, но почему нельзя через jQuery просто сделать так:
$('.user-panel__user-name').text();

Answer 5

[Виталий Инчин ☢]

document.body.innerHTML.match(/<a class="user-panel__user\-name"[^>]*([^<]+)/);
//На выходе
[
'<a class="user-panel__user-name" href="https://toster.ru/user/andreystrelkov">andreystrelkov</a>',
'andreystrelkov'
]

Но, ведь это, блин, JS...JavaScript - мощный инструмент для работ с DOM. А вы собираетесь просто брать и парсить HTML. Это задача для PHP или подобного языка, но уж точно не для данного!

Как вам уже написали - вот самое верное решение вашей задачи!

var text = document.querySelector(".user-panel__user-name").innerText;

Answer 6

[Alex]

// Получаем все элементы
var elements = document.querySelectorAll('.user-panel__user-name');
// Получаем массив содержимого, каждую строку тримим
var matches = Array.prototype.map.call(elements, function(username) {
   return username.innerHTML.replace(/^\s+|\s+$/g, '');
});

Answer 7

[smiros]

мне изучить регулярные выражения помогла лекция №6 от Hexlet JavaScript
ну еще есть сайты...