[经验总结]XSLT输出的HTML空元素导致jQurey解析出错

本文主要是介绍[经验总结]XSLT输出的HTML空元素导致jQurey解析出错,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

*/ -->

Author: Thinkhy
Date: 2010.04.11.
Url: http://www.disandu.com/?p=714
Keyword: HTML空元素 DIV XSLT jQuery

今天有个HTML空元素的问题折腾了我两个小时,问题是这样的,我要处理一段描述结构化文本的HTML片断:

  <div class='paper'> 
<div class='question'>
<div class="subject">To be or not to be, it's a  question?</div>
<div class="choice">A</div>
<div class="choice">B</div>
<div class="choice">C</div>
<div class="choice">D</div>
<div class="aside" />
</div>      

<div class="question" >
<div class="subject">Who am I?</div>
<div class="choice">A</div>
<div class="choice">B</div>
<div class="choice">C</div>
<div class="choice">D</div>
<div class="aside" />
</div>      
</div>

需要取到每一个class名为question的div,逐个进行处理。首先还是用的jQuery方法取:

  $("div.question").each( function() { 
alert($(this).html());
do-something-here ....
}
);

在each方法中将每个元素的html文档取出来,发现div的html内容取得不对,比如取第一个div.question时将之后所有的quesion内容就包括了。于是,我开始逐行删除,缩小出错范围,最后的问题是出在这一行:<div class="aside" />。这时,我隐约记得,HTML标记对空元素的表示不同于XML,有时候就必须要有结束标签。果真是这样,为这行空div加上</div>结束符标签,世界又美好如常了。

从开发者的角度,需要更深入的了解出错原因。仔细一想,这个问题的来源是XSLT模板。上面的HTML内容是经过XSLT模板转换得到的,而在XSLT里output元素的method属性被设置为"xml",这样导致空元素被简写为"<element/>"的形式。让我们再读一段W3C的标准文档(http://www.w3.org/TR/xslt#section-XML-Output-Method):

The html output method should not output an end-tag for empty elements. For HTML 4.0, the empty elements are area, base, basefont, br, col, frame, hr, img, input, isindex, link, meta and param. For example, an element written as <br/> or <br></br> in the stylesheet should be output as <br>.

从上面的标准文档中可以推测,浏览器可能将<div/>处理成<div>,这就会导致上面出现的错误。

问题到这里应该算彻底解决了,但IE却又带来了难题,将XSLT中output method设置为html后,图片不能显示了,原因是图片路径中有汉字,出现了编码不识别的问题,换了好几个中文编码都没成功。最后只得在空div中加了个空格,强制div元素非空。

今天的经历告诉我们,要勤读标准文档,不要相信MS。

这篇关于[经验总结]XSLT输出的HTML空元素导致jQurey解析出错的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/862884

相关文章

PostgreSQL的扩展dict_int应用案例解析

《PostgreSQL的扩展dict_int应用案例解析》dict_int扩展为PostgreSQL提供了专业的整数文本处理能力,特别适合需要精确处理数字内容的搜索场景,本文给大家介绍PostgreS... 目录PostgreSQL的扩展dict_int一、扩展概述二、核心功能三、安装与启用四、字典配置方法

C# 比较两个list 之间元素差异的常用方法

《C#比较两个list之间元素差异的常用方法》:本文主要介绍C#比较两个list之间元素差异,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录1. 使用Except方法2. 使用Except的逆操作3. 使用LINQ的Join,GroupJoin

深度解析Java DTO(最新推荐)

《深度解析JavaDTO(最新推荐)》DTO(DataTransferObject)是一种用于在不同层(如Controller层、Service层)之间传输数据的对象设计模式,其核心目的是封装数据,... 目录一、什么是DTO?DTO的核心特点:二、为什么需要DTO?(对比Entity)三、实际应用场景解析

深度解析Java项目中包和包之间的联系

《深度解析Java项目中包和包之间的联系》文章浏览阅读850次,点赞13次,收藏8次。本文详细介绍了Java分层架构中的几个关键包:DTO、Controller、Service和Mapper。_jav... 目录前言一、各大包1.DTO1.1、DTO的核心用途1.2. DTO与实体类(Entity)的区别1

Java中的雪花算法Snowflake解析与实践技巧

《Java中的雪花算法Snowflake解析与实践技巧》本文解析了雪花算法的原理、Java实现及生产实践,涵盖ID结构、位运算技巧、时钟回拨处理、WorkerId分配等关键点,并探讨了百度UidGen... 目录一、雪花算法核心原理1.1 算法起源1.2 ID结构详解1.3 核心特性二、Java实现解析2.

使用Python绘制3D堆叠条形图全解析

《使用Python绘制3D堆叠条形图全解析》在数据可视化的工具箱里,3D图表总能带来眼前一亮的效果,本文就来和大家聊聊如何使用Python实现绘制3D堆叠条形图,感兴趣的小伙伴可以了解下... 目录为什么选择 3D 堆叠条形图代码实现:从数据到 3D 世界的搭建核心代码逐行解析细节优化应用场景:3D 堆叠图

深度解析Python装饰器常见用法与进阶技巧

《深度解析Python装饰器常见用法与进阶技巧》Python装饰器(Decorator)是提升代码可读性与复用性的强大工具,本文将深入解析Python装饰器的原理,常见用法,进阶技巧与最佳实践,希望可... 目录装饰器的基本原理函数装饰器的常见用法带参数的装饰器类装饰器与方法装饰器装饰器的嵌套与组合进阶技巧

解析C++11 static_assert及与Boost库的关联从入门到精通

《解析C++11static_assert及与Boost库的关联从入门到精通》static_assert是C++中强大的编译时验证工具,它能够在编译阶段拦截不符合预期的类型或值,增强代码的健壮性,通... 目录一、背景知识:传统断言方法的局限性1.1 assert宏1.2 #error指令1.3 第三方解决

全面解析MySQL索引长度限制问题与解决方案

《全面解析MySQL索引长度限制问题与解决方案》MySQL对索引长度设限是为了保持高效的数据检索性能,这个限制不是MySQL的缺陷,而是数据库设计中的权衡结果,下面我们就来看看如何解决这一问题吧... 目录引言:为什么会有索引键长度问题?一、问题根源深度解析mysql索引长度限制原理实际场景示例二、五大解决

深度解析Spring Boot拦截器Interceptor与过滤器Filter的区别与实战指南

《深度解析SpringBoot拦截器Interceptor与过滤器Filter的区别与实战指南》本文深度解析SpringBoot中拦截器与过滤器的区别,涵盖执行顺序、依赖关系、异常处理等核心差异,并... 目录Spring Boot拦截器(Interceptor)与过滤器(Filter)深度解析:区别、实现