Навигация по HTML документу – примеры Java

В этой статье вы узнаете, как перемещаться по HTML-документу и выполнять детальную проверку его элементов с помощью API Aspose.HTML for Java. Вы можете легко создать собственное приложение для анализа, сбора или извлечения информации из HTML-документов, поскольку наш API предоставляет мощный набор инструментов для навигации по документу с помощью CSS Selector, XPath Query или пользовательских фильтров.

HTML-навигация

Существует множество способов создания HTML-навигации. В следующем списке показан самый простой способ доступа ко всем элементам DOM используя класс Node:

Property	Description
FirstChild	Accessing this attribute of an element must return a reference to the first child node.
LastChild	Accessing this attribute of an element must return a reference to the last child node
NextSibling	Accessing this attribute of an element must return a reference to the sibling node of that element which most immediately follows that element.
PreviousSibling	Accessing this attribute of an element must return a reference to the sibling node of that element which most immediately precedes that element.
ChildNodes	Returns a list that contains all children of that element.

Используя упомянутые свойства, вы можете перемещаться по HTML-документу следующим образом:

// Prepare HTML code
String html_code = "<span>Hello,</span> <span>World!</span>";

// Initialize a document from the prepared code
HTMLDocument document = new HTMLDocument(html_code, ".");

// Get the reference to the first child (first <span>) of the document body
Element element = document.getBody().getFirstElementChild();
System.out.println(element.getTextContent());
// output: Hello,

// Get the reference to the second <span> element
element = element.getNextElementSibling();
System.out.println(element.getTextContent());
// output: World!

Для более сложных сценариев, когда вам нужно найти узел по определенному шаблону (например, получить список заголовков, ссылок и т. д.), вы можете использовать специализированный TreeWalker или NodeIterator объект с собственной реализацией Filter.

В следующем примере показано, как реализовать собственный NodeFilter для пропуска всех элементов, кроме изображений:

public static class OnlyImageFilter extends NodeFilter {
@Override
    public short acceptNode(Node n) {
        // The current filter skips all elements, except IMG elements.
        return "img".equals(n.getLocalName())
                ? FILTER_ACCEPT
                : FILTER_SKIP;
    }
}

После реализации фильтра вы можете использовать HTML-навигацию следующим образом:

// Prepare HTML code
String code = "    < p > Hello, </p >\n" +
        "    <img src = 'image1.png' >\n" +
        "    <img src = 'image2.png' >\n" +
        "    <p > World ! </p >\n";

// Initialize a document based on the prepared code
HTMLDocument document = new HTMLDocument(code, ".");

// To start HTML navigation, we need to create an instance of TreeWalker
// The specified parameters mean that it starts walking from the root of the document, iterating all nodes, and using our custom implementation of the filter
ITreeWalker iterator = document.createTreeWalker(document, NodeFilter.SHOW_ALL, new HtmlNavigationTests.OnlyImageFilter());
// Use
while (iterator.nextNode() != null) {
    // Since we are using our own filter, the current node will always be an instance of the HTMLImageElement
    // So, we don't need the additional validations here
    HTMLImageElement image = (HTMLImageElement) iterator.getCurrentNode();

    System.out.println(image.getSrc());
    // output: image1.png
    // output: image2.png
}

XPath

Альтернативой HTML-навигации является XML Path Language. Синтаксис выражений XPath довольно прост и, что более важно, его легко читать и поддерживать.

В следующем примере показано, как использовать запросы XPath в Java API Aspose.HTML:

// Prepare HTML code
String code = "< div class='happy' >\n" +
        "        <div >\n" +
        "            <span > Hello! </span >\n" +
        "        </div >\n" +
        "    </div >\n" +
        "    <p class='happy' >\n" +
        "        <span > World! </span >\n" +
        "    </p >\n";

// Initialize a document based on the prepared code
HTMLDocument document = new HTMLDocument(code, ".");

// Here, we evaluate the XPath expression where we select all child <span> elements from elements whose 'class' attribute equals to 'happy'
IXPathResult result = document.evaluate("//*[@class='happy']//span",
        document,
        null,
        XPathResultType.Any,
        null
);

// Iterate over the resulted nodes
for (Node node; (node = result.iterateNext()) != null; ) {
    System.out.println(node.getTextContent());
    // output: Hello!
    // output: World!
}

CSS-селектор

Наряду с HTML Navigation и XPath вы ​​можете использовать CSS Selector API, который также поддерживается нашей библиотекой. Этот API предназначен для создания шаблона поиска для сопоставления элементов в дереве документа на основе синтаксиса CSS Selectors.

// Prepare HTML code
String code = "< div class='happy' >\n" +
        "        <div >\n" +
        "            <span > Hello, </span >\n" +
        "        </div >\n" +
        "    </div >\n" +
        "    <p class='happy' >\n" +
        "        <span > World ! </span >\n" +
        "    </p >\n";

// Initialize a document based on the prepared code
HTMLDocument document = new HTMLDocument(code, ".");

// Here, we create a CSS Selector that extracts all elements whose 'class' attribute equals to 'happy' and their child SPAN elements
NodeList elements = document.querySelectorAll(".happy span");

// Iterate over the resulted list of elements
elements.forEach(element -> {
    System.out.println(((HTMLElement) element).getInnerHTML());
    // output: Hello,
    // output: World!
});