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 实现的点击复制代码
Mar 24 Javascript
使用JavaScript构建JSON格式字符串实现步骤
Mar 22 Javascript
jQuery 快速结束当前正在执行的动画
Nov 20 Javascript
javascript贪吃蛇完整版(源码)
Dec 09 Javascript
使用js实现一个可编辑的select下拉列表
Feb 20 Javascript
Jquery之Bind方法参数传递与接收的三种方法
Jun 24 Javascript
jQuery Mobile弹出窗、弹出层知识汇总
Jan 05 Javascript
利用Vue v-model实现一个自定义的表单组件
Apr 27 Javascript
React 子组件向父组件传值的方法
Jul 24 Javascript
vue基于element-ui的三级CheckBox复选框功能的实现代码
Oct 15 Javascript
原生js实现贪吃蛇游戏
Oct 26 Javascript
微信小程序:报错(in promise) MiniProgramError
Oct 30 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
可以在线执行PHP代码包装修正版
2008/03/15 PHP
PHP延迟静态绑定示例分享
2014/06/22 PHP
PHP开发框架kohana中处理ajax请求的例子
2014/07/14 PHP
php操作XML、读取数据和写入数据的实现代码
2014/08/15 PHP
cakephp2.X多表联合查询join及使用分页查询的方法
2017/02/23 PHP
php大小写转换函数(strtolower、strtoupper)用法介绍
2017/11/17 PHP
js技巧--转义符&quot;\&quot;的妙用
2007/01/09 Javascript
jQuery Ajax 实例代码 ($.ajax、$.post、$.get)
2016/04/29 Javascript
关于预加载InstantClick的问题解决方法
2017/09/12 Javascript
浅谈Vue.js中ref ($refs)用法举例总结
2017/12/19 Javascript
Vue实现active点击切换方法
2018/03/16 Javascript
Vue 报错TypeError: this.$set is not a function 的解决方法
2018/12/17 Javascript
Layui点击图片弹框预览的实现方法
2019/09/16 Javascript
nodejs制作小爬虫功能示例
2020/02/24 NodeJs
jQuery事件模型默认行为执行顺序及trigger()与 triggerHandler()比较实例分析
2020/04/30 jQuery
跟老齐学Python之集成开发环境(IDE)
2014/09/12 Python
Python科学计算之Pandas详解
2017/01/15 Python
Python FTP两个文件夹间的同步实例代码
2018/05/25 Python
python判断文件是否存在,不存在就创建一个的实例
2019/02/18 Python
python实现把二维列表变为一维列表的方法分析
2019/10/08 Python
CSS3按钮鼠标悬浮实现光圈效果源码
2016/09/11 HTML / CSS
SheIn俄罗斯:时尚女装网上商店
2017/02/28 全球购物
Black Halo官方网站:购买连衣裙、礼服和连体裤
2018/06/13 全球购物
幼儿教师个人求职信范文
2013/09/21 职场文书
财务工作犯错检讨书
2014/10/07 职场文书
2014会计年终工作总结
2014/12/20 职场文书
玄武湖导游词
2015/02/05 职场文书
2015年母亲节活动策划方案
2015/05/04 职场文书
肖申克的救赎观后感
2015/06/02 职场文书
初中同学会致辞
2015/08/01 职场文书
机关单位2016年法制宣传日活动总结
2016/04/01 职场文书
MySQL注入基础练习
2021/05/30 MySQL
Redis如何实现分布式锁
2021/08/23 Redis
mysql下的max_allowed_packet参数设置详解
2022/02/12 MySQL
win11如何查看端口是否被占用? Win11查看端口是否占用的技巧
2022/04/05 数码科技
铁头也玩根德 YachtBoy YB-230......
2022/04/05 无线电