HTML中不支持静态Expando的元素的问题


Posted in Javascript onMarch 08, 2007

在使用脚本统一处理一批页面的时候,我希望通过被处理页面的TITLE元素取到文档的标题和我自定义的一些属性。这些附加的属性是我在服务器端通过Attributes集合添加的,可是运行的结果和我的期望老是相去甚远,怎么我在TITLE元素里写入的自定义属性老是空值呢?

    客服端和服务器端代码分别是:

    ASPX:
<title id="title" runat="server">Query Info</title>
    C#:  protected HtmlGenericControl title;

private void Page_Load(object sender, System.EventArgs e)
{
    // ...
    title.InnerHtml = "查询信息";
    title.Attributes["icon"] = "QueryInfo.gif;
}
    HTML:
<title id="title" icon="QueryInfo.gif">查询信息</title>
    JavaScript:
var iconPath = docucment.all.tags('TITLE')[0].icon;
if ( iconPath )
{
    var img = document.createElement('IMG');
    img.src = iconPath;
    // ...
}

    结果就是总出不来我希望的那个icon,跟踪JavaScript代码,发现iconPath总是undefined。在看看HTML代码,里面明明有icon="QueryInfo.gif"这个属性值对。于是从title对象中去查看outerHTML,outerHTML居然是:<title id="title">查询信息</title>。根本没有icon那个属性,难怪JavaScript取到的iconPath总是undefined的说。

    仔细查下去,发现原来是html元素在处理expando属性上有区别。我们给html元素添加expando属性有两种方式,一是我们常用的动态方式;就是使用脚本来给html元素添加expando属性。二是使用静态方式;即在html代码中以literal方式添加expando属性。分别举例如下:

    动态添加expando属性: <span id=mySpan>this is a span element.</span>
<script language=javascript>
mySpan.myAttri = 'attribute';
</script>
    静态添加expando属性: <span id=mySpan myAttri=attribute>this is a span element.</span>
    本来这两种写法基本是没有什么区别的,可是元素title却只支持动态添加expando属性,而不支持静态添加expando属性,这也就是为什么我开始会出错误的原因。那么还有那些html elements和title一样不支持静态添加expando属性呢?在108个html elements中,以下10个元素都不支持静态添加expando属性:
HTML, HEAD, TITLE, BODY, BASEFONT, FORM, HR, HR, TBODY, SCRIPT
    不过动态添加expando属性,是所有的html elements和dhtml objects都支持的。

Javascript 相关文章推荐
由JavaScript技术实现的web小游戏(不含网游)
Jun 12 Javascript
基于jQuery实现的百度导航li拖放排列效果,即时更新数据库
Jul 31 Javascript
JQuery验证jsp页面属性是否为空(实例代码)
Nov 08 Javascript
两种方法实现在HTML页面加载完毕后运行某个js
Jun 16 Javascript
整理Javascript基础入门学习笔记
Nov 29 Javascript
关于JS中的apply,call,bind的深入解析
Apr 05 Javascript
AngularJS Ajax详解及示例代码
Aug 17 Javascript
浅谈JavaScript作用域和闭包
Sep 18 Javascript
利用Node.js了解与测量HTTP所花费的时间详解
Sep 22 Javascript
详解node child_process模块学习笔记
Jan 24 Javascript
angular 组件通信的几种实现方式
Jul 13 Javascript
详解ES7 Decorator 入门解析
Feb 18 Javascript
使用TextRange获取输入框中光标的位置的代码
Mar 08 #Javascript
获取JavaScript用户自定义类的类名称的代码
Mar 08 #Javascript
JScript内置对象Array中元素的删除方法
Mar 08 #Javascript
在JavaScript中遭遇级联表达式陷阱
Mar 08 #Javascript
原型方法的不同写法居然会影响调试的解决方法
Mar 08 #Javascript
在js中使用&quot;with&quot;语句中跨frame的变量引用问题
Mar 08 #Javascript
JS类库Bindows1.3中的内存释放方式分析
Mar 08 #Javascript
You might like
PL-880隐藏功能
2021/03/01 无线电
PHP分页效率终结版(推荐)
2013/07/01 PHP
javascript 文档的编码问题解决
2009/03/01 Javascript
jquery 卷帘效果实现代码(不同方向)
2013/02/05 Javascript
javascript操作excel生成报表全攻略
2014/05/04 Javascript
DOM节点删除函数removeChild()用法实例
2015/01/12 Javascript
基于MVC5和Bootstrap的jQuery TreeView树形控件(一)之数据支持json字符串、list集合
2016/08/11 Javascript
vue2.0 中#$emit,$on的使用详解
2017/06/07 Javascript
VUE axios上传图片到七牛的实例代码
2017/07/28 Javascript
JS+Canvas绘制动态时钟效果
2017/11/10 Javascript
解决vue.js this.$router.push无效的问题
2018/09/03 Javascript
jQuery实现基本动画效果的方法详解
2018/09/06 jQuery
javascriptvoid(0)含义以及与&quot;#&quot;的区别讲解
2019/01/19 Javascript
微信小程序实现的一键复制功能示例
2019/04/24 Javascript
JS实现在线ps功能详解
2019/07/31 Javascript
Vue源码分析之Vue实例初始化详解
2019/08/25 Javascript
Js逆向实现滑动验证码图片还原的示例代码
2020/03/10 Javascript
JS猜数字游戏实例讲解
2020/06/30 Javascript
three.js 将图片马赛克化的示例代码
2020/07/31 Javascript
[53:10]2018DOTA2亚洲邀请赛 4.6 淘汰赛 VP vs VG 第一场
2018/04/11 DOTA
[34:41]夜魇凡尔赛茶话会 第二期02:你画我猜
2021/03/11 DOTA
python中循环语句while用法实例
2015/05/16 Python
用tensorflow构建线性回归模型的示例代码
2018/03/05 Python
selenium+python实现自动化登录的方法
2018/09/04 Python
python requests更换代理适用于IP频率限制的方法
2019/08/21 Python
python3 mmh3安装及使用方法
2019/10/09 Python
Python3常见函数range()用法详解
2019/12/30 Python
英国天然宝石首饰购买网站:Gemondo Jewellery
2018/10/23 全球购物
英国顶尖手表珠宝品牌独家授权经销商:HS Johnson
2020/10/28 全球购物
优秀大学生的自我评价
2014/01/16 职场文书
培训主管岗位职责
2014/02/01 职场文书
研究生求职自荐书
2014/06/23 职场文书
做人民满意的公务员活动方案
2014/08/25 职场文书
社区六一儿童节活动总结
2015/02/11 职场文书
个人培训总结
2015/03/05 职场文书
2015年爱牙日活动总结
2015/03/23 职场文书