XHTML标签的自关闭写法的坏处分析_经验交流
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了XHTML标签的自关闭写法的坏处分析_经验交流，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含9429字，纯文字阅读大概需要14分钟。
内容图文
如果你熟悉XML相关的开发，可能也就习惯于这种写法，想着XML中任何不含子节点的元素都可以这样写，那么XHTML中没有内容的标签也都可以这样写。XHTML中理论上当然允许任何标签以自关闭的方法来书写，然而浏览器兼容性却带来了新问题，那就是IE无法正确识别某些标签的自关闭写法。
请尝试输入以下XHTML代码并在IE中浏览： hello world
解释源自另外一段类似的代码： hello world
这时候我们就明白前面那段代码为什么看不到后面的world了，因为它被当作script的一部分来识别了。这就说明了，在我们使用XHTML时并不能好像XML那样随意的使用自关闭的写法，只有少数原本不需要关闭的标签可以用自关闭的写法，其他标签即使没有任何内容最好也用成对的关闭写法。
最后需要提醒大家的是，其实弱智的parser不仅仅IE有，很多地方都可能碰到由于parser不严谨而引起的问题，所以我们在书写XHTML的时候还是要迁就一些老HTML继承下来的习惯，不能好像真的XML那样自以为符合标准了就随意写。不信？那么再试一个吧： hello
world
Update: 有部分读者认为我举的例子是不符合XHTML规范的，那么请先阅读XHTML规范。Empty Elements一节的中文翻译如下：“空元素必须要么有一个结束标记，要么以/>结束，例如
或
。请参考HTML兼容性标准以获取关于确保向后兼容HTML4浏览器的信息。”可以看得到，规范中也给出了
这样的例子，说明
的写法是符合XHTML规范的，只是没有兼容HTML4标准。那么到底XHTML是否兼容HTML4呢？我们来看Compatibility Issues一节，中文翻译如下：“虽然并没有要求XHTML1.0文档兼容现有的浏览器，但在实践中这并不难做到。”因此，XHTML是没有规定文档必须向下兼容，我给出的例子都是合法的XHTML文档片断，当出现在完整的XHTML里面时也全部能通过W3C Markup Validation Service的验证。
Update again: 其实我写这篇文章的目的不是为了强调只符合XHTML规范就行了，也不是强调符合XHTML同时兼容HTML4就够了，而是应该考虑更多需要兼容的情况。例如你的CMS中允许用户提交HTML，提交的HTML经过SgmlReader或者其他方法格式化为XHTML，同时或许还做了其它XML处理，这时候就有可能将用户提交的转换为，这种情况下你需要通过跟踪调试找出问题并不容易，因为XML处理并没有违反任何规范，每一步的处理都是符合语义的。另外最好不要把<br />写成<br/>，因为确实有些弱智的parser仅仅因为少了一个空格就无法正确识别。<a href="http://www.laitingfm.com" /><img src="http://www.gxlcms.com/ad/link.jpg" /></a> <a href="https://curl.qcloud.com/kfoLTs9R" /><img src="http://www.gxlcms.com/ad/1040x100.jpg" /></a> <font color="red">本条技术文章来源于互联网，如果无意侵犯您的权益请点击此处反馈<a href="http://www.gxlcms.com/?s=gb-show-p-1.html">版权投诉</a></font> </article> </div> <div class="w310 r"> <a href="https://www.gxlcms.com/server-467421.html" target="_blank"> <img src="http://www.gxlcms.com/Public/aiod/ts.jpg" /></a> <div class="youclmt"> <h3>css热搜</h3> </div> <div class="langmubt"> <ul> <li><a href="/css-259310.html" target="_blank">五种CSS利用table实现常用布局的方法</a></li><li><a href="/css-259311.html" target="_blank">利用css隐藏input的光标方法</a></li><li><a href="/css-259316.html" target="_blank">HTML5WebWorker的使用实例教程</a></li><li><a href="/css-259318.html" target="_blank">CSS3实现头像旋转效果实例分享</a></li><li><a href="/css-259321.html" target="_blank">CSS3font-feature-settings特性减除字体动画震颤效果实例分享</a></li><li><a href="/css-259322.html" target="_blank">纯CSS实现手风琴效果示例详解</a></li><li><a href="/css-259324.html" target="_blank">5种CSS垂直水平居中的最佳方案</a></li><li><a href="/css-259326.html" target="_blank">使用CSS给表单必选项添加星号实例分享</a></li><li><a href="/css-259328.html" target="_blank">css3实现冲击波效果</a></li><li><a href="/css-259334.html" target="_blank">四种引入css的方式总结</a></li><li><a href="/css-259335.html" target="_blank">canvas的视频遮罩插件实例分享</a></li><li><a href="/css-259336.html" target="_blank">CSS使用Grid布局构建网站首页</a></li><li><a href="/css-259341.html" target="_blank">CSS命名规范节约Debug时间解答</a></li><li><a href="/css-259347.html" target="_blank">Dreamweaver网页怎么添加弹出窗口信息详解</a></li><li><a href="/css-259349.html" target="_blank">html5Canvas实现图片旋转</a></li><li><a href="/css-259350.html" target="_blank">html+css+js实现拍照预览上传图片功能实例分享</a></li><li><a href="/css-259351.html" target="_blank">css3做0.5px的细线实例分享</a></li><li><a href="/css-259358.html" target="_blank">CSS圆形缩放动画实现代码分享</a></li><li><a href="/css-259359.html" target="_blank">CSS定位实例讲解</a></li><li><a href="/css-259364.html" target="_blank">判断滚动条滑到底部触发事件实例分享</a></li><li><a href="/css-259366.html" target="_blank">CSS使用position:sticky实现粘性布局实例详解</a></li><li><a href="/css-259375.html" target="_blank">CSS的经典三栏布局如何实现</a></li><li><a href="/css-259392.html" target="_blank">css3实现鼠标跟随导航效果</a></li><li><a href="/css-259398.html" target="_blank">CSS3通过@keyframes创建动画</a></li><li><a href="/css-259404.html" target="_blank">css实现右侧固定宽度左侧宽度自适应</a></li> </ul> </div> <a href="https://curl.qcloud.com/I8w1gZa8" target="_blank"> <img src="http://www.gxlcms.com/ad/tx500x500.jpg" /></a> </div> </div> </div> </div> <script type="text/javascript" src="/layui/layui.js"></script> <script> layui.use('code', function() { layui.code({ elem: 'pre', //默认值为.layui-code about: false, skin: 'notepad', title: 'XHTML标签的自关闭写法的坏处分析_经验交流代码块', encode: true //是否转义html标签。默认不开启 }); }); </script> <link rel="stylesheet" type="text/css" href="/kan/css/basezb.css"> <script type="text/javascript" src="/kan/js/read.js"></script> <div style="display:none"> <div class="login-box" id="login-dialog"> <div class="login-top"><a class="current" rel="nofollow" id="login1" onclick="setTab('login',1,2);" >登录</a></div> <div class="login-form" id="nav-signin"> <!-- <div class="login-ico"><a rel="nofollow" class="qq" id="qqlogin" target="_blank" href="/?s=user-center-qqlogin.html"> QQ </a></div> --> <div class="login-box-form" id="con_login_1"> <form id="loginform" action="/?s=user-center-login.html" method="post" onsubmit="return false;"> <p class="int-text"> <input class="email" id="username" name="username" type="text" value="用户名或Email" onfocus="if(this.value=='用户名或Email'){this.value='';}" onblur="if(this.value==''){this.value='用户名或Email';};" ></p> <p class="int-text"> <input class="password1" type="password" id="password" name="password" value="******" onBlur="if(this.value=='') this.value='******';" onFocus="if(this.value=='******') this.value='';" > </p> <p class="int-info"> <label class="ui-label"> </label> <label for="agreement" class="ui-label-checkbox"> <input type="checkbox" value="" name="cookietime" id="cookietime" checked="checked" value="2592000"> <input type="hidden" name="notforward" id="notforward" value="1"> <input type="hidden" name="dosubmit" id="dosubmit" value="1">记住我的登录 </label> <a rel="nofollow" class="aright" href="/?s=user-center-forgetpwd.html" target="_blank"> 忘记密码？ </a></p> <p class="int-btn"><a rel="nofollow" id="loginbt" class="loginbtn"><span>登录</span></a></p> </form> </div> <form id="regform" action="/?s=user-center-reg.html" method="post"> <div class="login-reg" style="display: none;" id="con_login_2"> <input type="hidden" name="t" id="t"/> <p class="int-text"> <input id="email" name="email" type="text" value="Email" onfocus="if(this.value=='Email'){this.value='';}" onblur="if(this.value==''){this.value='Email';};"></p> <p class="int-text"> <input id="uname" name="username" type="text" value="用户名或昵称" onfocus="if(this.value=='用户名或昵称'){this.value='';}" onblur="if(this.value==''){this.value='用户名或昵称';};"></p> <p class="int-text"> <input type="password" id="pwd" name="password" value="******" onBlur="if(this.value=='') this.value='******';" onFocus="if(this.value=='******') this.value='';"> </p> <p class="int-text1"><span class="inputbox"> <input id="validate" name="validate" type="text" value="验证码" onfocus="if(this.value=='验证码'){this.value='';}" onblur="if(this.value==''){this.value='验证码';};"> </span><span class="yzm-img"><img src="/?s=user-checkcode-index" alt="看不清楚换一张" id="indexlogin"></p> <p class="int-info"> <label> <input value="" name="agreement" id="agreement" CHECKED="checked" type="checkbox"> 我已阅读<a rel="nofollow" href="/?s=user-center-agreement.html">用户协议</a>及<a rel="nofollow" href="/?s=user-center-agreement.html">版权声明</a></label> </p> <p class="int-btn"><input type="hidden" name="dosubmit"/> <a rel="nofollow" class="loginbtn" id="register"><span>注册</span></a></p> </div> </form> </div> </div> </div> </div> <script type="text/javascript" src="/kan/js/foot_js.js"></script> <div id="footer"> <div class="w1200"> <p class="tips_text">本站所有资源全部来源于网络，若本站发布的内容侵害到您的隐私或者利益，请联系我们删除！ <a href="/?s=gb-show-p-1.html" title="合作方式" target="_blank">合作方式</a></p> <p class="tips_text">Copyright © 2004-2018 https://www.gxlcms.com/. All Rights Reserved.<script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?afb4873a3fbaa95f710a04306bfb4a0b"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <a href="http://beian.miit.gov.cn/" target="_blank">豫ICP备19030742号</a></p> </div> </div> <link rel="stylesheet" href="/Public/del/css/list.css"> </body> </html>
内容总结
以上是互联网集市为您收集整理的XHTML标签的自关闭写法的坏处分析_经验交流全部内容，希望文章能够帮你解决XHTML标签的自关闭写法的坏处分析_经验交流所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。