/usr/share/qt5/doc/qtwebkitexamples/qtwebkitexamples-webkitwidgets-domtraversal-example.html is in qtwebkit5-examples-doc-html 5.5.1+dfsg-2build1.
This file is owned by root:root, with mode 0o644.
The actual contents of the file can be viewed below.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 | <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- domtraversal.qdoc -->
<title>DOM Traversal Example | Qt WebKit Examples 5.5</title>
<link rel="stylesheet" type="text/css" href="style/offline.css" />
</head>
<body>
<div class="header" id="qtdocheader">
<div class="main">
<div class="main-rounded">
<div class="navigationbar">
<ul>
<li>Qt 5.5</li>
<li><a href="qtwebkitexamples-index.html">Qt WebKit Examples</a></li>
<li>DOM Traversal Example</li>
<li id="buildversion">Qt 5.5.1 Reference Documentation</li>
</ul>
</div>
</div>
<div class="content">
<div class="line">
<div class="content mainContent">
<div class="sidebar">
<div class="toc">
<h3><a name="toc">Contents</a></h3>
<ul>
<li class="level1"><a href="#window-class-definition">Window Class Definition</a></li>
<li class="level1"><a href="#window-class-implementation">Window Class Implementation</a></li>
<li class="level1"><a href="#starting-the-example">Starting the Example</a></li>
<li class="level1"><a href="#further-reading">Further Reading</a></li>
</ul>
</div>
<div class="sidebar-content" id="sidebar-content"></div></div>
<h1 class="title">DOM Traversal Example</h1>
<span class="subtitle"></span>
<!-- $$$webkitwidgets/domtraversal-description -->
<div class="descr"> <a name="details"></a>
<p class="centerAlign"><img src="images/webkit-domtraversal.png" alt="" /></p><p>The <a href="../qtwebkit/qtwebkit-bridge.html#qwebelement">QWebElement</a> class provides an API that can be used to examine the structure and content of a Web page via a Document Object Model (DOM) interface. It can be used for basic traversal of the document structure, to search for particular elements (see the <a href="qtwebkitexamples-webkitwidgets-simpleselector-example.html">Simple Selector Example</a>), and to modify content in-place.</p>
<p>This example uses a <a href="../qtwebkit/qwebview.html">QWebView</a> widget to display the Web page, and a dock widget holds the <a href="../qtwidgets/qtreewidget.html">QTreeWidget</a> that shows the document structure. These widgets are placed in an instance of the <code>Window</code> class, which we describe below.</p>
<a name="window-class-definition"></a>
<h2 id="window-class-definition">Window Class Definition</h2>
<p>The <code>Window</code> class is derived from <a href="../qtwidgets/qmainwindow.html">QMainWindow</a> and its user interface is created using Qt Designer. As a result, the class is also derived from the user interface class created by uic:</p>
<pre class="cpp"><span class="preprocessor">#include "ui_window.h"</span>
<span class="keyword">class</span> Window : <span class="keyword">public</span> <span class="type"><a href="../qtwidgets/qmainwindow.html">QMainWindow</a></span><span class="operator">,</span> <span class="keyword">private</span> Ui<span class="operator">::</span>Window
{
Q_OBJECT
<span class="keyword">public</span>:
Window(<span class="type"><a href="../qtwidgets/qwidget.html">QWidget</a></span> <span class="operator">*</span>parent <span class="operator">=</span> <span class="number">0</span>);
<span class="type">void</span> setUrl(<span class="keyword">const</span> <span class="type"><a href="../qtcore/qurl.html">QUrl</a></span> <span class="operator">&</span>url);
<span class="keyword">public</span> <span class="keyword">slots</span>:
<span class="type">void</span> on_webView_loadFinished();
<span class="keyword">private</span>:
<span class="type">void</span> examineChildElements(<span class="keyword">const</span> <span class="type"><a href="../qtwebkit/qwebelement.html">QWebElement</a></span> <span class="operator">&</span>parentElement<span class="operator">,</span>
<span class="type"><a href="../qtwidgets/qtreewidgetitem.html">QTreeWidgetItem</a></span> <span class="operator">*</span>parentItem);
};</pre>
<p>Two important functions to note are the <code>on_webView_loadFinished()</code> slot and the <code>examineChildElements()</code> function. The former is automatically called when the <a href="../qtwebkit/qwebview.html">QWebView</a> widget finishes loading a page. See the <a href="qtwebkitexamples-webkitwidgets-domtraversal-example.html#further-reading">Further Reading</a> section for more information on this mechanism.</p>
<p>The <code>examineChildElements()</code> function is used to traverse the document structure and add items to the <a href="../qtwidgets/qtreewidget.html">QTreeWidget</a>.</p>
<a name="window-class-implementation"></a>
<h2 id="window-class-implementation">Window Class Implementation</h2>
<p>In the <code>Window</code> class constructor, we call the <a href="../qtwidgets/qwidget.html#setupUi">setupUi()</a> function to set up the user interface described in the <code>window.ui</code> file:</p>
<pre class="cpp">Window<span class="operator">::</span>Window(<span class="type"><a href="../qtwidgets/qwidget.html">QWidget</a></span> <span class="operator">*</span>parent)
: <span class="type"><a href="../qtwidgets/qmainwindow.html">QMainWindow</a></span>(parent)
{
setupUi(<span class="keyword">this</span>);
}</pre>
<p>When the Web page is loaded, the <code>on_webView_loadFinished()</code> slot is called. Here, we clear the tree widget and begin inspection of the document by obtaining the document element from the page's main frame:</p>
<pre class="cpp"><span class="type">void</span> Window<span class="operator">::</span>on_webView_loadFinished()
{
treeWidget<span class="operator">-</span><span class="operator">></span>clear();
<span class="type"><a href="../qtwebkit/qwebframe.html">QWebFrame</a></span> <span class="operator">*</span>frame <span class="operator">=</span> webView<span class="operator">-</span><span class="operator">></span>page()<span class="operator">-</span><span class="operator">></span>mainFrame();
<span class="type"><a href="../qtwebkit/qwebelement.html">QWebElement</a></span> document <span class="operator">=</span> frame<span class="operator">-</span><span class="operator">></span>documentElement();
examineChildElements(document<span class="operator">,</span> treeWidget<span class="operator">-</span><span class="operator">></span>invisibleRootItem());
}</pre>
<p>At this point, we call the <code>examineChildElements()</code> function to traverse the document, starting with the child elements of the document element for which we will create top level items in the tree widget.</p>
<p>The <code>examineChildElements()</code> function accepts a parent element and a parent item. Starting with the first child element, which we obtain with the element's <a href="../qtwebkit/qwebelement.html#firstChild">firstChild()</a> function, we examine each child element of the parent item. For each valid (non-null) element, which we check by calling its <a href="../qtwebkit/qwebelement.html#isNull">isNull()</a> function, we create a new <a href="../qtwidgets/qtreewidgetitem.html">QTreeWidgetItem</a> instance with the element name and add it to the parent item.</p>
<pre class="cpp"><span class="type">void</span> Window<span class="operator">::</span>examineChildElements(<span class="keyword">const</span> <span class="type"><a href="../qtwebkit/qwebelement.html">QWebElement</a></span> <span class="operator">&</span>parentElement<span class="operator">,</span>
<span class="type"><a href="../qtwidgets/qtreewidgetitem.html">QTreeWidgetItem</a></span> <span class="operator">*</span>parentItem)
{
<span class="type"><a href="../qtwebkit/qwebelement.html">QWebElement</a></span> element <span class="operator">=</span> parentElement<span class="operator">.</span>firstChild();
<span class="keyword">while</span> (<span class="operator">!</span>element<span class="operator">.</span>isNull()) {
<span class="type"><a href="../qtwidgets/qtreewidgetitem.html">QTreeWidgetItem</a></span> <span class="operator">*</span>item <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="../qtwidgets/qtreewidgetitem.html">QTreeWidgetItem</a></span>();
item<span class="operator">-</span><span class="operator">></span>setText(<span class="number">0</span><span class="operator">,</span> element<span class="operator">.</span>tagName());
parentItem<span class="operator">-</span><span class="operator">></span>addChild(item);
examineChildElements(element<span class="operator">,</span> item);
element <span class="operator">=</span> element<span class="operator">.</span>nextSibling();
}
}</pre>
<p>We recursively examine the child elements for each element by calling <code>examineChildElements()</code> with the current child element and the newly-created item. To obtain the next element at the same level in the document, we call its <a href="../qtwebkit/qwebelement.html#nextSibling">nextSibling()</a> function.</p>
<p>This recursive approach to reading the document makes it easy to create a simple representation of the document structure in a tree widget.</p>
<p>For completeness, we show the <code>setUrl()</code> function, which is provided to allow the document URL to be set from the example's <code>main()</code> function.</p>
<pre class="cpp"><span class="type">void</span> Window<span class="operator">::</span>setUrl(<span class="keyword">const</span> <span class="type"><a href="../qtcore/qurl.html">QUrl</a></span> <span class="operator">&</span>url)
{
webView<span class="operator">-</span><span class="operator">></span>setUrl(url);
}</pre>
<a name="starting-the-example"></a>
<h2 id="starting-the-example">Starting the Example</h2>
<p>We set up the application, create a <code>Window</code> instance, set its URL, and show it:</p>
<pre class="cpp"><span class="preprocessor">#include <QApplication></span>
<span class="preprocessor">#include "window.h"</span>
<span class="type">int</span> main(<span class="type">int</span> argc<span class="operator">,</span> <span class="type">char</span> <span class="operator">*</span>argv<span class="operator">[</span><span class="operator">]</span>)
{
<span class="type"><a href="../qtwidgets/qapplication.html">QApplication</a></span> app(argc<span class="operator">,</span> argv);
Window window;
window<span class="operator">.</span>show();
window<span class="operator">.</span>setUrl(<span class="type"><a href="../qtcore/qurl.html">QUrl</a></span>(<span class="string">"http://qt-project.org/"</span>));
<span class="keyword">return</span> app<span class="operator">.</span>exec();
}</pre>
<p>When the application's event loop is run, the Qt home page will load, and the tree widget will be updated to show the document structure. Navigating to another page will cause the tree widget to be updated to show the document structure of the new page.</p>
<a name="further-reading"></a>
<h2 id="further-reading">Further Reading</h2>
<p>The <a href="../qtwebkit/qtwebkit-bridge.html#qwebelement">QWebElement</a> documentation contains more information about DOM access for the <a href="../qtwebkit/qtwebkit-qmlmodule.html">QtWebKit</a> classes.</p>
<p>In this example, we take advantage of Qt's auto-connection feature to avoid explicitly connecting signals to slots. The user interface contains a <a href="../qtwebkit/qwebview.html">QWebView</a> widget called <code>webView</code> whose <a href="../qtwebkit/qwebview.html#loadFinished">loadFinished()</a> signal is automatically connected to the <code>on_webView_loadFinished()</code> slot when we call <a href="../qtwidgets/qwidget.html#setupUi">setupUi()</a> in the <code>Window</code> constructor.</p>
<p>Files:</p>
<ul>
<li><a href="qtwebkitexamples-webkitwidgets-domtraversal-window-cpp.html">webkitwidgets/domtraversal/window.cpp</a></li>
<li><a href="qtwebkitexamples-webkitwidgets-domtraversal-window-h.html">webkitwidgets/domtraversal/window.h</a></li>
<li><a href="qtwebkitexamples-webkitwidgets-domtraversal-window-ui.html">webkitwidgets/domtraversal/window.ui</a></li>
<li><a href="qtwebkitexamples-webkitwidgets-domtraversal-main-cpp.html">webkitwidgets/domtraversal/main.cpp</a></li>
<li><a href="qtwebkitexamples-webkitwidgets-domtraversal-domtraversal-pro.html">webkitwidgets/domtraversal/domtraversal.pro</a></li>
</ul>
</div>
<!-- @@@webkitwidgets/domtraversal -->
</div>
</div>
</div>
</div>
</div>
<div class="footer">
<p>
<acronym title="Copyright">©</acronym> 2015 The Qt Company Ltd.
Documentation contributions included herein are the copyrights of
their respective owners.<br> The documentation provided herein is licensed under the terms of the <a href="http://www.gnu.org/licenses/fdl.html">GNU Free Documentation License version 1.3</a> as published by the Free Software Foundation.<br> Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property
of their respective owners. </p>
</div>
</body>
</html>
|