Table des matières
2. Prise en charge des paramètres de style CSS
4. Évolutivité puissante
Maison interface Web tutoriel HTML Explication détaillée d'un moteur d'analyse HTML parfait (Jumony)

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

May 04, 2017 pm 02:57 PM

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:php;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!

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

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Comment déverrouiller tout dans Myrise
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Quel est le but du & lt; Progress & gt; élément? Quel est le but du & lt; Progress & gt; élément? Mar 21, 2025 pm 12:34 PM

L'article traite du HTML & lt; Progress & GT; élément, son but, son style et ses différences par rapport au & lt; mètre & gt; élément. L'objectif principal est de l'utiliser & lt; Progress & gt; pour l'achèvement des tâches et & lt; mètre & gt; pour stati

Quel est le but du & lt; datalist & gt; élément? Quel est le but du & lt; datalist & gt; élément? Mar 21, 2025 pm 12:33 PM

L'article traite du HTML & lt; Datalist & GT; élément, qui améliore les formulaires en fournissant des suggestions de saisie semi-automatique, en améliorant l'expérience utilisateur et en réduisant les erreurs. COMMANDE COMPRES: 159

Quel est le but du & lt; mètre & gt; élément? Quel est le but du & lt; mètre & gt; élément? Mar 21, 2025 pm 12:35 PM

L'article traite du HTML & lt; mètre & gt; élément, utilisé pour afficher des valeurs scalaires ou fractionnaires dans une plage, et ses applications courantes dans le développement Web. Il différencie & lt; mètre & gt; De & lt; Progress & gt; et ex

Quelles sont les meilleures pratiques pour la compatibilité entre les navigateurs dans HTML5? Quelles sont les meilleures pratiques pour la compatibilité entre les navigateurs dans HTML5? Mar 17, 2025 pm 12:20 PM

L'article examine les meilleures pratiques pour assurer la compatibilité des navigateurs de HTML5, en se concentrant sur la détection des fonctionnalités, l'amélioration progressive et les méthodes de test.

Quelle est la balise Meta de la fenêtre? Pourquoi est-ce important pour une conception réactive? Quelle est la balise Meta de la fenêtre? Pourquoi est-ce important pour une conception réactive? Mar 20, 2025 pm 05:56 PM

L'article traite de la balise Meta de la fenêtre, essentielle pour la conception Web réactive sur les appareils mobiles. Il explique comment une utilisation appropriée garantit une mise à l'échelle optimale du contenu et une interaction utilisateur, tandis que la mauvaise utilisation peut entraîner des problèmes de conception et d'accessibilité.

Comment utiliser le html5 & lt; time & gt; élément pour représenter les dates et les temps sémantiquement? Comment utiliser le html5 & lt; time & gt; élément pour représenter les dates et les temps sémantiquement? Mar 12, 2025 pm 04:05 PM

Cet article explique le html5 & lt; time & gt; élément de représentation sémantique de date / heure. Il souligne l'importance de l'attribut DateTime pour la lisibilité à la machine (format ISO 8601) à côté du texte lisible par l'homme, stimulant AccessIbilit

Comment utiliser les attributs de validation du formulaire HTML5 pour valider l'entrée utilisateur? Comment utiliser les attributs de validation du formulaire HTML5 pour valider l'entrée utilisateur? Mar 17, 2025 pm 12:27 PM

L'article discute de l'utilisation des attributs de validation de formulaire HTML5 comme les limites requises, motifs, min, max et longueurs pour valider la saisie de l'utilisateur directement dans le navigateur.

Quel est le but du & lt; iframe & gt; étiqueter? Quelles sont les considérations de sécurité lorsque vous l'utilisez? Quel est le but du & lt; iframe & gt; étiqueter? Quelles sont les considérations de sécurité lorsque vous l'utilisez? Mar 20, 2025 pm 06:05 PM

L'article traite du & lt; iframe & gt; L'objectif de Tag dans l'intégration du contenu externe dans les pages Web, ses utilisations courantes, ses risques de sécurité et ses alternatives telles que les balises d'objet et les API.

See all articles