web-dev-qa-db-fra.com

Comment trouver la balise div non fermée

Un problème div non-fermé me rend presque fou. Il est très difficile de suivre en particulier lorsque la page est longue et complexe.

Aucune suggestion?

52
user503853

Comme indiqué précédemment, exécuter votre code avec le validateur W3C est excellent, mais si votre page est complexe, vous ne savez toujours pas exactement où se trouve div.

J'aime utiliser des tabulations pour indenter mon code. Il est organisé visuellement de manière à ce que ces problèmes soient plus faciles à trouver. Enfants, frères et sœurs, parents, etc., ils seront plus évidents.

EDIT: De plus, je vais utiliser quelques commentaires HTML pour marquer les balises de fermeture dans les zones complexes. Je les garde au minimum pour la propreté.

<body>

    <div>
        Main Content

        <div>
            Div #1 content

            <div>
               Child of div #1

               <div>
                   Child of child of div #1
               </div><!--// close of child of child of div #1 //-->
            </div><!--// close of child of div #1 //-->
        </div><!--// close of div #1 //-->

        <div>
            Div #2 content
        </div>

        <div>
            Div #3 content
        </div>

    </div><!--// close of Main Content div //-->

</body>
25
Sparky

J'ai créé un outil en ligne appelé Finder Tag Unclosed qui fera ce dont vous avez besoin.

Collez-le dans votre code HTML et vous obtiendrez un résultat du type "La balise de fermeture de la ligne 188 ne correspond pas à la balise ouverte de la ligne 62".

Mise à jour: Le nouvel emplacement du localisateur de balises non fermées est https://jonaquino.blogspot.com/2013/05/unclosed-tag -Finder.html

34
Jonathan Aquino

le validateur HTML du World Wide Web Consortium est très efficace pour détecter les erreurs HTML.

15
rockerest

Je sais qu'il y a déjà eu de bonnes réponses, mais je suis tombé sur cette question avec une recherche Google et j'aurais aimé que quelqu'un ait signalé cet outil de vérification en ligne ...

http://www.tormus.com/tools/div_checker

Vous venez de jeter une URL et il vous montrera la carte entière de la page. Très utile pour un débogage rapide comme j'en avais besoin.

15
Noah Whitmore

Utilisez le bloc-notes ++. vous pouvez les trouver facilement

http://notepad-plus-plus.org/download/

Ou vous pouvez Afficher la source de FIREfox - Les divs non fermés seront affichés dans [~ # ~] rouge [~ # ~]

13
Thilanka De Silva

1- Compter le nombre de <div dans le bloc-notes ++ (Ctrl + F)
2- Compter le nombre de </div

Comparez les deux nombres!

8
Milad

Si vous utilisez Dreamweaver, vous pouvez facilement noter la division non fermée. Dans le volet de gauche de la vue de code, vous pouvez y voir <>highlight invalid code, cliquez sur ce bouton et vous remarquerez que la div non fermée est en surbrillance, puis fermez votre div non fermée. Appuyez sur F5 pour actualiser la page pour voir que toute autre div non fermée est là.

Vous pouvez également valider votre page dans Dreamweaver également. File>Check Page>Browser Compatibility, le volet des tâches apparaîtra Cliquez sur Validation, sur le côté gauche, vous verrez le bouton ► cliquez dessus pour valider.

Prendre plaisir!

2
Bhojendra Rauniyar

En prenant la suggestion de Milad un peu plus loin, vous pouvez décomposer votre source de document, puis faire une autre recherche, en continuant jusqu'à trouver le coupable incomparable.

Lorsque vous travaillez avec plusieurs modules (à l'aide d'un CMS) ou n'avez pas accès à l'outil W3C (car vous travaillez localement), cette approche est vraiment utile.

1
RogerRoger

Les balises Div sont faciles à repérer pour moi. Il suffit de télécharger le fichier, de l’analyser avec netbeans, puis de continuer à le déboguer. Ou vous pouvez utiliser le kit de développement Google chrome) et afficher le code source de la page. Je suis un développeur un peu bizarre, je n'utilise pas toujours les "meilleurs" éléments. Mais cela fonctionne pour moi.

Je vais vous lier avec des trucs de développeur que j'utilise

http://www.coffeecup.com/free-editor/

http://www.netbeans.org

Ce ne sont là que quelques-uns des bons. Je suis ouvert à plus de suggestions à cette liste: D

Bonne programmation

-skycoder

1
TheCodingKlam