今天测试TextField通过读取xml文件完成新闻列表,并且第一条标红加粗,遇到了CSS控制失效的问题,仔细研究了一下,发现有许多细节知识点不熟悉导致的,现在公布一下过程,以免新手重蹈覆辙。
//xml文件格式
<channel>
<title>新闻列表</title>
<news>
<font color='#ff0000'><a href='http://www.jsfund.cn/portal/infodetail.hfm?classid=10129&id=10167811' target='_blank'>● 嘉实基金:市场震荡调整结构性机会涌现</a></font>
<a href='http://www.jsfund.cn/portal/infodetail.hfm?classid=10129&id=10167812' target='_blank'>● 四季度前中小盘股仍是市场主流</a>
</news>
</channel>
//调入新闻列表
程序运行后,发现带连接的css均失效,font color定义也没有效果,但单独应用font color还是a连接都有效果(如下图所示,会看到还有许多有空隙和排版有问题的地方)。
[img]http://dl.iteye.com/upload/attachment/329261/bbfa0e17-fdc9-39a1-be50-65e15bed0b19.jpg[/img]
后尝试修改xml文件为下列格式:
<channel>
<title>新闻列表</title>
<news>
<font color='#ff0000'><a href='http://www.jsfund.cn/portal/infodetail.hfm?classid=10129&id=10167811' target='_blank'>● 嘉实基金:市场震荡调整结构性机会涌现</a></font>
<a href='http://www.jsfund.cn/portal/infodetail.hfm?classid=10129&id=10167812' target='_blank'>● 四季度前中小盘股仍是市场主流</a>
</news>
</channel>
css及html功能定义均正常。
分析问题原因:
1.众所周知的原因xml内容部分对于<>这种保留字符的转义;
2.xml文件读取为什么没报错?因为html这几个标签也是成对出现,符合xml标准,被当成节点读入,所以没有报xml格式错误;
3.上图所出现的空隙是因为news标签内的内容,包括空格都被直接写入htmlText,当成一个空串。
(下图是调整后的效果)
[img]http://dl.iteye.com/upload/attachment/329264/4cc27dc2-d42a-3c39-8790-a69cd9856dc9.jpg[/img]
//xml文件格式
<channel>
<title>新闻列表</title>
<news>
<font color='#ff0000'><a href='http://www.jsfund.cn/portal/infodetail.hfm?classid=10129&id=10167811' target='_blank'>● 嘉实基金:市场震荡调整结构性机会涌现</a></font>
<a href='http://www.jsfund.cn/portal/infodetail.hfm?classid=10129&id=10167812' target='_blank'>● 四季度前中小盘股仍是市场主流</a>
</news>
</channel>
//调入新闻列表
function loadNews() {
_txt.htmlText=myXML.child("channel").child("news")[0];
var sheet:StyleSheet=new StyleSheet;//定义CSS对象
var s="a:link{color:#ffffff; text-decoration:none;}";//组css字串,也可外挂成css文件
s+="a:hover{color:#fff600; text-decoration:none;}";
s+=".b a:link{color:#ff0000}";
sheet.parseCSS(s); //css解析
_txt.styleSheet=sheet;//css应用到text框
trace(_txt.htmlText)//输出原始代码,用于分析flash内部处理原理
}
程序运行后,发现带连接的css均失效,font color定义也没有效果,但单独应用font color还是a连接都有效果(如下图所示,会看到还有许多有空隙和排版有问题的地方)。
[img]http://dl.iteye.com/upload/attachment/329261/bbfa0e17-fdc9-39a1-be50-65e15bed0b19.jpg[/img]
后尝试修改xml文件为下列格式:
<channel>
<title>新闻列表</title>
<news>
<font color='#ff0000'><a href='http://www.jsfund.cn/portal/infodetail.hfm?classid=10129&id=10167811' target='_blank'>● 嘉实基金:市场震荡调整结构性机会涌现</a></font>
<a href='http://www.jsfund.cn/portal/infodetail.hfm?classid=10129&id=10167812' target='_blank'>● 四季度前中小盘股仍是市场主流</a>
</news>
</channel>
css及html功能定义均正常。
分析问题原因:
1.众所周知的原因xml内容部分对于<>这种保留字符的转义;
2.xml文件读取为什么没报错?因为html这几个标签也是成对出现,符合xml标准,被当成节点读入,所以没有报xml格式错误;
3.上图所出现的空隙是因为news标签内的内容,包括空格都被直接写入htmlText,当成一个空串。
(下图是调整后的效果)
[img]http://dl.iteye.com/upload/attachment/329264/4cc27dc2-d42a-3c39-8790-a69cd9856dc9.jpg[/img]