Html 如何找到未关闭的div标签
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6272327/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to find the unclosed div tag
提问by
A unclosed div problem almost make me crazy. It is very difficult to track especially when the page is long and complex.
一个未关闭的 div 问题几乎让我发疯。跟踪非常困难，尤其是当页面又长又复杂时。
Any suggestions?
有什么建议？
采纳答案by Sparky
As stated already, running your code through the W3C Validatoris great but if your page is complex, you still may not know exactly where to find the open div.
如前所述，通过W3C 验证器运行您的代码很棒，但是如果您的页面很复杂，您可能仍然不知道在哪里可以找到打开的 div。
I like using tabs to indent my code. It keeps it visually organized so that these issues are easier to find, children, siblings, parents, etc... they'll appear more obvious.
我喜欢使用制表符来缩进我的代码。它保持视觉上的组织，以便更容易找到这些问题，孩子，兄弟姐妹，父母等......它们会显得更明显。
EDIT:Also, I'll use a few HTML comments to mark closing tags in the complex areas. I keep these to a minimum for neatness.
编辑：另外，我将使用一些 HTML 注释来标记复杂区域中的结束标记。为了整洁，我将这些保持在最低限度。
<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>
回答by Jonathan Aquino
I made an online tool called Unclosed Tag Finderwhich will do what you need.
我制作了一个名为Unclosed Tag Finder的在线工具，它可以满足您的需求。
Paste in your HTML, and it will give you output like "Closing tag on line 188 does not match open tag on line 62."
粘贴到您的 HTML 中，它将为您提供类似“第 188 行的结束标记与第 62 行的打开标记不匹配”的输出。
Update:The new location of the Unclosed Tag Finder is https://jonaquino.blogspot.com/2013/05/unclosed-tag-finder.html
更新：Unclosed Tag Finder 的新位置是https://jonaquino.blogspot.com/2013/05/unclosed-tag-finder.html
回答by rockerest
the World Wide Web Consortium HTML Validatoris great at catching HTML errors.
在万维网联盟HTML验证是在追赶HTML错误很大。
回答by Noah Whitmore
I know that there have already been some good answers, but I came across this question with a Google Search and I wish someone would have pointed out this online checking tool...
我知道已经有一些很好的答案，但我在谷歌搜索中遇到了这个问题，我希望有人能指出这个在线检查工具......
http://www.tormus.com/tools/div_checker
http://www.tormus.com/tools/div_checker
You just throw in a URL and it will show you the entire map of the page. Very useful for a quick debug like I needed.
您只需输入一个 URL，它就会向您显示页面的整个地图。对于我需要的快速调试非常有用。
回答by Thilanka De Silva
Use notepad ++ . you can find them easily
使用记事本++。你可以很容易地找到它们
http://notepad-plus-plus.org/download/
http://notepad-plus-plus.org/download/
Or you can View source from FIREfox- Unclosed divswill be shown in RED
或者您可以从 FIREFox 查看源代码- 未关闭的div将以红色显示
回答by Milad
1- Count the number of <divin notepad++ (Ctrl + F)
2- Count the number of </div
1- 计算<div记事本++中的数量（Ctrl + F）
2- 计算数量</div
Compare the two numbers!
比较两个数字！
回答by Bhojendra Rauniyar
If you use Dreamweaver you could easily note to unclosed div. In the left pane of the code view you can see there <>highlight invalid codebutton, click this button and you will notice the unclosed div highlighted and then close your unclosed div. Press F5 to refresh the page to see that any other unclosed div are there.
如果您使用 Dreamweaver，您可以轻松地注意到未关闭的 div。在代码视图的左窗格中，您可以看到有<>highlight invalid code按钮，单击此按钮，您会注意到未关闭的 div 突出显示，然后关闭未关闭的 div。按 F5 刷新页面以查看是否存在任何其他未关闭的 div。
You can also validate your page in Dreamweaver too. File>Check Page>Browser Compatibility, then task-pane will appear Click on Validation, on the left side there you'll see ? button click this to validate.
您也可以在 Dreamweaver 中验证您的页面。File>Check Page>Browser Compatibility，然后将出现任务窗格单击Validation，在左侧您会看到 ? 按钮单击此按钮进行验证。
Enjoy!
享受！
回答by RogerRoger
Taking Milad's suggestion a bit further, you can break your document source down and then do another find, continuing until you find the unmatched culprit.
进一步考虑 Milad 的建议，您可以分解您的文档来源，然后再进行一次查找，直到您找到无法匹配的罪魁祸首为止。
When you are working with many modules (using a CMS), or don't have access to the W3C tool (because you are working locally), this approach is really helpful.
当您使用许多模块（使用 CMS），或者无法访问 W3C 工具（因为您在本地工作）时，这种方法非常有用。
回答by TheCodingKlam
Div tags are easy to spot for me. Just download the file, scan it or so with netbeans, then continue debugging it. Or you can use the Google chrome developer kit, and view the page source. I'm a bit of a weird developer, I don't always use the "best" stuff. But it works for me.
Div 标签对我来说很容易发现。只需下载文件，使用 netbeans 对其进行扫描，然后继续调试它。或者你可以使用谷歌浏览器开发工具包，查看页面源码。我是一个有点奇怪的开发人员，我并不总是使用“最好”的东西。但它对我有用。
I'll link you with some developer stuff I use
我会把你和我使用的一些开发人员的东西联系起来
http://www.coffeecup.com/free-editor/
http://www.coffeecup.com/free-editor/
Those are just a few of the good ones out there. I'm open to more suggestions to this list :D
这些只是一些好的。我愿意对此列表提出更多建议：D
Happy programming
快乐编程
-skycoder
-skycoder
