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

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

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

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

control webbrowser


Набираем команду codeby webinar

Набираем команду для организации и проведения вебинаров Подробнее ...

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

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

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

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

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

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

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


Требуются разработчики и тестеры для проекта codebyOS

Требования для участия в проекте: Знание принципов работы ОС на базе Linux; Знание Bash; Крайне желательное знание CPP, Python, Lua; Навыки системного администрирования. Подробнее ...

Похожие темы

HTML Injection — Web Application Pentesting https://codeby.net/forum/threads/web-application-pentesting-html-injection.59031/ Сегодня мы с вами начнем осваивать базовые понятие инъекция код...
c# Как быстро найти ссылки на сайте?... Как найти ссылки на сайте? Сегодня на простом примере я хочу показать Вам, как можно быстро найти ссылки на сайте с помощью элемента управления WebBro...
c# Создание веб-сервера с помощью класса HttpListe... Как создать веб-сервер с помощью класса HttpListener? В этой небольшой статье рассмотрим на простом примере, как создать веб-сервер с помощью языка c...
WebBrowser основные свойства для работы с контенто... WebBrowser работа с контентом И так, html страница была полностью загружена в control webBrowser, и теперь можно переходить к обработке полученных да...
c# Создание веб-сервера (дополнение)... Создание веб-сервера на языке c# (дополнение) Данная статья является дополнением к предыдущей статье: как создать веб-сервер с помощью языка c#. В не...