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 相关文章推荐
JS操作图片(增,删,改) 例子
Apr 17 Javascript
js获取当前路径的简单示例代码
Jan 08 Javascript
Node.js中的事件驱动编程详解
Aug 16 Javascript
node.js中的fs.stat方法使用说明
Dec 16 Javascript
AngularJS基础知识笔记之表格
May 10 Javascript
在Html中使用Requirejs进行模块化开发实例详解
Apr 15 Javascript
浅谈javascript运算符——条件,逗号,赋值,()和void运算符
Jul 15 Javascript
javascript的document中的动态添加标签实现方法
Oct 24 Javascript
vue中axios解决跨域问题和拦截器的使用方法
Mar 07 Javascript
详解swiper在vue中的应用(以3.0为例)
Sep 20 Javascript
微信小程序 冒泡事件原理解析
Sep 27 Javascript
Node使用Selenium进行前端自动化操作的代码实现
Oct 10 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 zip文件解压类代码
2009/12/02 PHP
php dirname(__FILE__) 获取当前文件的绝对路径
2011/06/28 PHP
PHP定时执行任务实现方法详解(Timer)
2015/07/30 PHP
jquery仿京东导航/仿淘宝商城左侧分类导航下拉菜单效果
2013/04/24 Javascript
jquery中animate动画积累的解决方法
2013/10/05 Javascript
JQuery中使用Ajax赋值给全局变量异常的解决方法
2014/01/10 Javascript
jquery.Ajax()方法调用Asp.Net后台的方法解析
2014/02/13 Javascript
js确认删除对话框效果的示例代码
2014/02/20 Javascript
z-blog SyntaxHighlighter 长代码无法换行解决办法(jquery)
2014/11/16 Javascript
JS实现弹出浮动窗口(支持鼠标拖动和关闭)实例详解
2015/08/06 Javascript
原生js实现图片层叠轮播切换效果
2016/02/02 Javascript
Jquery实现$.fn.extend和$.extend函数
2016/04/14 Javascript
详解nodejs与javascript中的aes加密
2016/05/22 NodeJs
详解Angular Reactive Form 表单验证
2017/07/06 Javascript
Vue2.5通过json文件读取数据的方法
2018/02/27 Javascript
如何提升vue.js中大型数据的性能
2019/06/21 Javascript
微信小程序 下拉刷新及上拉加载原理解析
2019/11/06 Javascript
js实现无缝轮播图
2020/03/09 Javascript
jQuery实现点击滚动到指定元素上的方法分析
2020/03/19 jQuery
用Python写脚本,实现完全备份和增量备份的示例
2018/04/29 Python
详解Python3.6的py文件打包生成exe
2018/07/13 Python
Python实现的线性回归算法示例【附csv文件下载】
2018/12/29 Python
Python 常用模块 re 使用方法详解
2019/06/06 Python
selenium中get_cookies()和add_cookie()的用法详解
2020/01/06 Python
python3 循环读取excel文件并写入json操作
2020/07/14 Python
Python fileinput模块如何逐行读取多个文件
2020/10/05 Python
卡塔尔航空官方网站:Qatar Airways
2017/02/08 全球购物
Viking Direct荷兰:购买办公用品
2019/06/20 全球购物
营销专业应届生求职信
2013/11/26 职场文书
表彰先进集体通报
2014/01/12 职场文书
函授自我鉴定范文
2014/02/06 职场文书
大学生军训感想
2014/02/16 职场文书
公诉意见书范文
2015/06/05 职场文书
2019年大学生职业生涯规划书
2019/03/25 职场文书
React中的Context应用场景分析
2021/06/11 Javascript
CSS3中Animation实现简单的手指点击动画的示例
2021/07/15 HTML / CSS