编程学习

作者:JunChen 2005-5-24 9:56:57
原文:http://www.sovavsiti.cz/css/abbr.html
翻译:JunChen

版权:译者JunChen所有,转载请联系译者.
简介

<abbr>是用来为web页面上de简称(译者注:这里把简称和缩写分开而论,简称范围比缩写大,取首字母de缩写用<acronym>标签)添加适当标注deXHTML标签,WindowsdeIE浏览器暂不支持<abbr>标签. 在IE里,您可以应用CSS给<acronym>但是不能应用给<abbr>标签,IE会为<acronym>标签detitle属性显示提示,但是会忽略<abbr>标签.

这个IEdebug(或者特色)使得一些网站人员认为<abbr>标签一点用都没有,而显然这么认为是不对de.在Mozilla和Opera里还是很正确de处理了这个标签,并且它对于web内容de可读性和语义化来说非常重要.这也是我为什么一直在寻找解决方法,最终我找到了.

解决方法

本方法基于一个简单de事实:即使IE会忽略<abbr>标签,但是其他嵌套在<abbr>标签里de标签还是正常de.所以我在嵌了一个<span>标签在<abbr>里,设置<span>detitle和class属性,然后<abbr>开始变得和<acronym>标签一样了.

相关代码例子

看一下下面de相关代码,是一个简单de缩写词de例子:

<abbr title=”Cascading Style Sheets”>CSS</abbr>
现在,对比一下修改后de相关代码:

<abbr title=”Cascading Style Sheets”><span class=”abbr” title=”Cascading Style Sheets”>CSS</span></abbr>
自动操作

手动de给每一个<abbr>标签嵌入<span>显然不可能——既无聊又对Mozilla和Opera没必要.幸运de是,现在有一个自动de、基于客户端脚本de解决方法.

您可能注意到了,这个页面(译者注:原作者de页面)上de简写词语即使在IE里都会有提示,并且加了CSS样式(虚下划线和一个问号状de鼠标光标).然而您如果看一下源相关代码,您将找不到在上文提到de<span>标签.这得益于本页加载de一个简单deJavaScript:

function styleAbbr() {
var oldBodyText, newBodyText, reg
if (isIE) {
oldBodyText = document.body.innerHTML;
reg = /<ABBR([^>]*)>([^<]*)<\/ABBR>/g;
newBodyText = oldBodyText.replace(reg, ‘<ABBR $1><SPAN class=\”abbr\” $1>$2</SPAN></ABBR>’);
document.body.innerHTML = newBodyText;
}
}
window.onload = function(){
styleAbbr()
};

isIE = (document.all) ? true:false;

这段脚本会检查客户端浏览器,如果是IE,那么则替换所有de<abbr>标签为修改过de版本(嵌入了<span>).注意de是我必须使用正则表达式和innerHTML属性来取代标准deDOM方法,因为IE不能通过DOM来获取<abbr>属性.

样式化

最后看一下这个页面上使用deCSS.相当简单:

abbr, acronym, span.abbr {
cursor: help;
border-bottom: 1px dashed #000;
}
Mozilla和Opera使用abbr和acronym属性选择器,IE则使用acronym和span.abbr.无论如何,<abbr>和<acronym>都被样式化了——一个问号状de鼠标光标(当鼠标指上后)和虚下划线.

其他

1.感谢Michael Kusyn提供了JavaScript解决方法.
2.更多关于<abbr>,<acronym>标签和两者de区别,参考Craig SailadeHTML is not an acronym… (Evolt.org)

欢迎交流意见评论,可以发邮件至marek@sovavsiti.cz.

最近有个朋友离开IT行业二年de朋友说要实现用程序向某个网站de页面上传数据,他是意思是每天有几十条数据要在网站页面上填写,很烦,最好用程序来写.网站页面是用POST传递de,同时没有验证码之类de东东,只有一点限制就是5分种内不能填写二次记录.这一切都好办.

using System.Web;
using System.Net;
using System.Text;
using System.IO;

//创建对某个网站页面de请求

HttpWebRequest myRequest = (HttpWebRequest )WebRequest.Create(”http://www.knowsky.com/a.asp“)

//上传de数据,”TextBox1“这些东东是网站页面里de控件ID,如果要上传多个值也是用&来分隔

string postData=”TextBox1=” this.textBox1.Text “&TextBox2=” this.textBox2.Text “
&TextBox3=” this.textBox3.Text “&TextBox4=” this.textBox4.Text;
ASCIIEncoding encoding=new ASCIIEncoding();
byte[] byte1=encoding.GetBytes(postData);//最终编码后要上传de数据
// Set the content type of the data being posted.
myRequest.ContentType=”application/x-www-form-urlencoded”;
myRequest.Method=”post”;//post上传方式
// Set the content length of the string being posted.
myRequest.ContentLength=postData.Length;
Stream newStream=myRequest.GetRequestStream();
newStream.Write(byte1,0,byte1.Length);

一切就OK了,如果您想上传后看到网站de内容de话,可以在程序里放一个IE控件,使用

axWebBrowser1.Navigate(”http://www.knowsky.com/a.asp“)；
axWebBrowser1.Refresh2();

现在.有许多开发人员已经在使用ASP.NET2.0deWebResourcede功能了.WebResource允许我嵌入资源到程序集中.包括图像,文本等.

在介绍WebResource就不得不介绍一下WebResource.axd,我来看一下

script language=”javascript” src=”WebResource.axd?a=s&r=WebUIValidation.js&t=631944362841472848″ type=”text/javascript”></script>目前我发现webResource.axdde参数跟现在版本有属不同.在早期文章介绍属性:
a 程序集名称
r 资源文件名称
t 程序集最后修改de时间

webResource.axd只是ISAPI中de一个映射.您也可以在使用IhttpHandler.<add verb=”GET” path=”WebResource.axd” type=”System.Web.Handlers.AssemblyResourceLoader” /> webResource.axd是通过AssemblyResourceLoader类来自定义处理HTTP请求,根据所query传递de程序来识别从哪个程序集中获取哪个资源.

下面以微调控件为示例.

使用步骤:
添加要嵌入de资源(比如图像)到项中
在资源管理器中,单击文件,在property window(属性窗口)中build action选择embedded resource(嵌入资源).
添加下列文件到您deassessbly.cs文件哪中
[assembly: WebResource("Obies.Web.UI.WebControls.NumericTextBox.js", "application/x-javascript")]
[assembly: WebResource("Obies.Web.UI.WebControls.NumericTextBox_Silver_BtnUp.gif", "image/gif")]请注意WebResourceAttribute格式:
[assembly: WebResourceAttribute("MyNameSpaces.Resources.MyImage.gif", "image/gif")]
在CONTROL源码当中.您需要使用下面相关代码来获取图像
// get WebResource URLs for the embedded gif images
String BtnUpImgSrc = this.Page.ClientScript.GetWebResourceUrl(typeof(NumericTextBox),
“Obies.Web.UI.WebControls.NumericTextBox_” this.ImageSet.ToString() “_BtnUp.gif”);GetWebResourceUrl method:Gets a URL reference to a server-side resource.(获取对服务器端资源de URL 引用)
我发现在早期版本当中.它de使用方法是:this.page.GetWebResourceUrl

上面相关代码是从指定de程序集中当中获取图像名称:Obies.Web.UI.WebControls.NumericTextBox_” this.ImageSet.ToString() “_BtnUp.gif,它返回de是一个服务器端资源deURL引用地址.类似于:
WebResource.axd?d=gWYJBlnQKynoTePlJ34jxyoSpR2Rh9lpYd8ZrSl0&t=632812333820000000

另外,MS提供一个Header类.Header类主要是对HTML页面中de<Head runat=”server”></head>de操作.包括Title等
呵呵.以后要修改一个页面de标题很很简单了.
this.Header.Title = “This is the new page title.”;
添加CSS样式(style attribute) Style style = new Style();
style.ForeColor = System.Drawing.Color.Navy;
style.BackColor = System.Drawing.Color.LightGray;

// Add the style to the header for the body of the page
this.Header.StyleSheet.CreateStyleRule(style, null, “body”);

protected override void OnPreRender (EventArgs e) {
// get a WebResource URL for the core JS script and register it
this.Page.ClientScript.RegisterClientScriptResource(typeof(NumericTextBox),
“Obies.Web.UI.WebControls.NumericTextBox.js”);
// get a WebResource URL for the embedded CSS
String css = this.Page.ClientScript.GetWebResourceUrl (typeof(NumericTextBox),
“Obies.Web.UI.WebControls.NumericTextBox_” this.ImageSet “.css”);
// register the CSS
// this.Page.StyleSheetTheme = css;
//this.Page.Header.LinkedStyleSheets.Add (css);
//早期版本de方法？只能用下面de相关代码来解决了
HtmlLink link = new HtmlLink();
link.Attributes.Add(”type”, “text/css”);
link.Attributes.Add(”rel”, “stylesheet”);
link.Attributes.Add(”href”, css);
this.Page.Header.Controls.Add(link);

}
下面是微调控件de截图

使用方法:
<%@ register tagprefix=”cc” namespace=”Obies.Web.UI.WebControls” assembly=”Obies.Web.UI.WebControls” %>

<cc:NumericTextBox width=”50″ ImageSet=”Silver” length=”2″ runat=”server” id=”NumericTextBox1″
maxvalue=”10″ minvalue=”0″></cc:NumericTextBox>
<cc:NumericTextBox width=”50″ ImageSet=”Green” length=”2″ runat=”server” id=”NumericTextBox2″
maxvalue=”10″ minvalue=”0″></cc:NumericTextBox>

来源地址:http://msdn.microsoft.com/library/default.asp?url=/library/en-us/
dnvs05/html/webresource.asp
由于原来de相关代码有点问题,很多特性都是最新VS2005不支持de.所以进行了修改.
源码下载:http://www.cnblogs.com/Files/cnzc/PostWebFormBetweenFrames.zip

在写这篇文章查了很多资料.也尝试用心去写.但总感觉写de不是很好.网上也有相关dewebresourcede介绍.但发现很多都是目前最新版本不支持de.不知道是不是以前ASP.NET2.0早期版本.所以才进行了简单de修改.
以后在努力了.