Maison > interface Web > tutoriel HTML > le corps du texte

Explication détaillée d'un moteur d'analyse HTML parfait (Jumony)

零下一度
Libérer: 2017-05-04 14:57:37
original
7333 Les gens l'ont consulté

Peut-être que beaucoup de gens penseront que l'analyseur HTML actuel est suffisant, et que même de simples expressions régulières peuvent déjà répondre aux besoins de manipulation de documents HTML. Oui, pour la grande majorité des documents HTML sur Internet, en fait, la plupart d'entre eux répondent aux spécifications XHTML, et leur analyse ne nécessite pas un analyseur puissant. Mais un analyseur puissant est une chose, et un analyseur parfait en est une autre.

Jumony Core fournit d'abord un moteur d'analyse HTML presque parfait, et ses résultats d'analyse sont infiniment proches de ceux du navigateur. Qu'il s'agisse d'éléments sans balises de fin, d'éléments avec des balises de fin facultatives, d'attributs de balise ou de sélecteurs et styles CSS, tous les documents HTML légaux et illégaux seront analysés par le navigateur, et Jumony les analysera dans quel qu'il soit. En d'autres termes, les résultats de l'analyse de Jumony sont les mêmes que ceux de l'analyse du navigateur, vous n'avez donc plus à vous soucier de savoir si le document HTML peut être reconnu. Si le navigateur peut le lire, Jumony peut le comprendre.

Il n'y a qu'un pas entre la perfection et la puissance, mais un analyseur parfait vous permet de ne jamais avoir à vous soucier du document source HTML.

Ce qui suit est une liste incomplète des fonctionnalités prises en charge par l'analyseur Jumony

特性 例子
孤立的<解析为文本< a应当解析为< a
孤立的>解析为文本 >应当解析为>
标记属性(没有值的属性)
元素丢失结束标签

测试链接

可选结束标签元素
"body", "colgroup", "dd", "dt", "head", "html", "li", "option", "p", "tbody", "td", "tfoot", "th", "thead", "tr"

abc

123

无结束标签元素
"area", "base", "basefont", "br", "col", "frame", "hr", "img", "input", "isindex", "link", "meta" , "param", "wbr", "bgsound", "spacer", "keygen"
CDataÉlément <script>if ( 1<a ) alert( "< p>" );</script>
"script", "style", "textarea", "title"  
Élément préformaté
 ;<span class="font5"></span><span class="font6"></span></span></td>
</tr>Utilisez des guillemets simples pour les valeurs d'attribut <tr>
<td class="xl67" width="371">
<span style="font-family:courier new,courier;font-size:12px;"></span>< </td><td class="xl68" width="371"><span style="font-family:courier new,courier;font-size:12px;"></span></td></tr>N'utilisez pas de guillemets pour les valeurs d'attribut<tr><td class="xl67" width="371"><span style="font-family:courier new,courier;font-size:12px;"></span><a href=#></td>
<td class="xl68" width="371"> <span style="font-family:courier new,courier;font-size:12px;"></span>
</td>
</tr>Valeur d'attribut manquante (mais avec le signe égal)<tr>
<td class="xl67" width="371">
<span style="font-family:courier new,courier;font-size:12px;"></span><a href=></td>
<td class="xl68" width="371"><span style="font-family:courier new,courier;font-size:12px;"> </span></td>
</tr>Il y a un espace devant la valeur de l'attribut<tr>
<td class="xl67" width="371">
<span style="font-family:courier new,courier;font-size:12px;"></span><a href= "test.html"></td>
<td class="xl68" width="371"><span style="font-family:courier new,courier;font-size:12px;"></span></td>
</tr>Parse<tr>HTML<td class="xl67" width="371"><span style="font-family:courier new,courier;font-size:12px;">Déclaration</span></td>
<td class="xl68" width="371">
<span style="font-family:courier new,courier;font-size:12px;"></span><!DOCTYPE html></td>
</tr> <tr><td class="xl72" width="371"> <span style="font-family:courier new,courier;font-size:12px;"><p><br>Non seulement elle peut analyser le HTML à partir du texte, mais l'API de Jumony peut directement récupérer l'analyse des documents sur Internet et identifier automatiquement les encodages basés sur les en-têtes HTTP : </p><div class="code" style="position:relative; padding:0px; margin:0px;"><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false;">new JumonyParser().LoadDocument( "www.php.cn/" ).Find( ".post_item a.titlelnk" )
Copier après la connexion
Copier après la connexion

Et actuellement, seulement le deuxième HTML de Jumony d'analyse du projet open source HtmlAgilityPack a depuis longtemps cessé de se mettre à jour. Après tant d'années, il y a toujours des problèmes avec l'analyse des éléments

2. Prise en charge des paramètres de style CSS

La simple analyse HTML parfaite n'apporte pas beaucoup d'avantages. Comme mentionné ci-dessus, en fait, la plupart des documents HTML peuvent être analysés avec une analyse de second ordre. même de simples expressions régulières, alors pourquoi avons-nous besoin de Jumony ?

La réponse est qu'un moteur HTML ne se limite pas à analyser la structure DOM.

Considérez ce scénario : je dois définir une valeur aucune pour le style d'affichage d'un élément. Dans le navigateur, nous n'avons besoin que d'un simple element.style.display = "none" pour répondre à nos exigences. Maintenant, nous avons obtenu le DOM dont nous avons besoin via l'analyseur, mais avons-nous encore besoin de concaténer des chaînes pour définir le style ?

Pas besoin, Jumony prend en charge l'analyse de style CSS, et même certaines règles d'abréviation de style CSS peuvent être reconnues Dans Jumony, définir un style pour un élément est aussi simple que dans le navigateur :

element.Style( "display", "none" )
Copier après la connexion
<. 🎜 >Regardons à nouveau cet exemple :

, que se passera-t-il si nous définissons padding-left: 0px sur cet élément ?

Dans Jumony, le résultat sera :

<p style="padding-left: 0px; padding-right: 5px; padding-top:5px; padding-bottom: 5px"></p>
Copier après la connexion
Regardez, l'attribut padding est automatiquement développé comme par magie.


3. Prise en charge du sélecteur CSS 3

Le sélecteur CSS est un langage de requête populaire dans le monde HTML. Il est simple et puissant et est pris en charge par de nombreux navigateurs. Jumony prend également en charge des sélecteurs CSS3 presque complets (à l'exception des pseudo-classes et pseudo-objets d'exécution). A l'aide de sélecteurs, nous pouvons facilement trouver les objets qui nous intéressent en HTML. Par exemple, récupérez tous les titres des articles sur la page d'accueil du parc de blogs :

new JumonyParser().LoadDocument( "www.php.cn/" ).Find( ".post_item a.titlelnk" )
Copier après la connexion
Copier après la connexion
Capturer, analyser, sélectionner, en une seule fois. Avec un simple code, nous pouvons sortir les données que nous avons capturées. la console :

 foreach( var title = new JumonyParser().LoadDocument( "www.php.cn/" ).Find( ".post_item a.titlelnk" ) )
  Console.WriteLine( title.InnerText() );
Copier après la connexion
Liste des sélecteurs CSS3 supportés par Jumony :

Sélecteur Description
* Sélectionner tous les éléments
p a Sélectionner les éléments descendants
p>a Sélectionner l'élément enfant
p+a Sélectionner les éléments adjacents
p~a Sélectionnez l'élément successeur
[attr] L'attribut existe, sélectionnez
[attr=value] La valeur de l'attribut correspond exactement
[attr ~=value] Correspondance approximative de la valeur d'attribut
[attr^=value] La valeur de l'attribut commence par la correspondance
[attr*=value] La valeur de l'attribut contient une correspondance
[attr$=value] La valeur de l'attribut se termine par une correspondance
[attr!=value] Correspondance négative de la valeur d'attribut
:non Pseudo-classe négative
:enfant unique Seul pseudo-classe d'élément enfant
 : uniquement de type Type uniquement pseudo- class
:empty Pseudo-classe d'élément vide
:ntième-enfant Pseudo-classe structurée
:ntième-dernier-enfant Pseudo-classe structurée
:ntième de type Pseudo-classe structurée
:ntième-dernier-de-type Pseudo-classe structurée
:premier-enfant Pseudo-classe structurée
:dernier-enfant Pseudo-classe structurée
: première du type Pseudo-classe structurée
:dernier-de-type Pseudo-classe structurée


4. Évolutivité puissante

Dans Jumony Core 3, il offre aux utilisateurs une évolutivité maximale. Vous pouvez personnaliser les spécifications HTML, implémentez votre propre analyseur, greffez d'autres modèles DOM à l'API Jumony, inventez votre propre pseudo-classe de sélecteur CSS, ou même modifiez votre propre API, comme le style jQuery.

Jumony Core a de nombreux projets dérivés, tels que l'exploration de sites Web, la fourniture d'API de style jQuery, le développement de sites Web, la création de fichiers MHT, l'ajout de la prise en charge du sélecteur CSS pour les résultats d'analyse HAP, etc. Ces projets nécessitent tous de bénéficier du puissant évolutivité de Jumony Core, il peut exercer des fonctions puissantes.

[Recommandations associées]

1. Tutoriel vidéo HTML en ligne gratuit

2. Manuel de développement HTML

3.Tutoriel vidéo html5 original php.cn

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal