Как найти html элемент по его классу?

В этой статье хотелось бы рассказать, как можно быстро и легко найти html элемент по его классу. Поиск элементов в HTML документе — это очень распространённая задача, с которой очень часто сталкиваются многие программисты, если например, нужно выполнить парсинг сайта или какой-нибудь отдельной HTML страницы. В отличие от других классов для работы с web, многие из которых содержат уже готовые методы, для решения данной задачи, class webBrowser по умолчанию не предоставляет такого функционала. Поэтому, если Вам необходимо найти элемент по его классу, то Вы можете воспользоваться следующим способом.

И так, предположим, что у нас есть простая html страница, состоящая из трёх блоков div. Задача: найти второй элемент div по его классу.

Создадим Windows Forms приложение, после чего добавим на форму: кнопку и элемент управления webBrowser. Если Вам не требуется графическое отображение страницы, то тогда замените control webBrowser на одноименный класс.

control webbrowser

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

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

Будем считать, что страница на данный момент полностью загружена, и теперь можно переходить к решению нашей задачи. И так на данный момент нас больше всего интересует запись: div class = «two», где div — это тэг, а class — это атрибут html элемента, который чаще всего используется для привязки стиля к одному или нескольким элементам на странице. И так, раз это html атрибут, то его можно легко найти с помощью метода GetAttribute. Но, перед этим нужно найти div элемент, у которого мы и будем искать эти атрибуты.

Не смотря на то, что коллекция (divs) содержит три элемента div, поиск по атрибуту class не даёт никаких результатов. Это происходит потому, что интерфейс HTMLElement, который описывает все элементы внутри дерева DOM, не содержит такого атрибута.

Как видно из описания интерфейса, вместо атрибута class используется атрибут className, это связано с тем, что во многих языках программирования слово class является ключевым словом, как например, в том же языке csharp, в результате чего часто возникали различные конфликтные ситуации, поэтому его было решено переименовать. Зная это, внесём небольшое изменение в наш выше написанный код:

Проверяем, теперь всё работает!

Читайте также:

Похожие темы

c# Как найти элемент с атрибутом id?... Поиск html элемента с атрибутом id Сегодня хочу показать на простом примере, как найти элемент с атрибутом id с помощью класса WebBrowser. Исходны...
C# WebBrowser. Часть 1: Получение и вывод данных... C# WebBrowser. Часть 1: Получение и вывод данных При создании одного из своих приложений мне потребовалось реализовать в нём возможность скачивать фа...
Web Application Pentesting | методы HTTP запросов... Добро пожаловать на курс Web Application Pentesting. В этой статье мы с вами научимся: Вручную посылать запросы на веб сервер через консольную утил...
HTML Injection — Web Application Pentesting https://codeby.net/forum/threads/web-application-pentesting-html-injection.59031/ Сегодня мы с вами начнем осваивать базовые понятие инъекция код...
Как получить имя html элемента при наведении мышки... Получение имени html элемента при наведении мышки Сегодня я хочу показать на простом примере, как получить имя html элемента при наведении мышкой в о...