随笔 - 11  文章 - 0 评论 - 14 trackbacks - 0
<2008年4月>
303112345
6789101112
13141516171819
20212223242526
27282930123
45678910

Locations of visitors to this page

与我联系

搜索

 

常用链接

留言簿

我的标签

随笔分类

随笔档案

相册

收藏夹

CSDN

积分与排名

  • 积分 - 3826
  • 排名 - 5930

最新评论

阅读排行榜

评论排行榜

前面的文章探讨了使用javascript来操纵HTML元素的自定义属性,那么在HTML页面中,除了系统支持的HTML元素外,是否可以建立自定义的HTML元素呢?答案是可以的。

自定义的HTML元素与系统自身的HTML元素地位相同,都可以用document.getElementById来获得,区别在于,自定义的HTML元素都是不可见的,类似于隐藏控件。

使用自定义HTML元素,我们就可以建立多种隐藏控件,而不一定拘泥于只能建立inputhidden元素了;另外,还可以用于某些特定方面的需求!

如在HTML页面中直接建立:

象创建系统自带的HTML元素那样添加:

var cy = document.createElement("YYY");
cy.id 
= "customControl_YYY";
cy.value 
= "自定义元素yyy";
cy.checked 
= true;
document.body.appendChild(cy);

2)用javascript来操作:

alert(document.getElementById("customControl_YYY").value);
alert(document.getElementById("customControl_YYY").checked);

在这里,Firefox支持直接取值,而不须用attributes属性集合。

代码如下:

<html>
    
<head>
        
<title>用javascript定义和操作自定义HTML元素</title>
        
<script language="javascript">
            
function getXXXValue()
            
{
                
//alert(document.getElementById("customControl_XXX").value);                                                //IE中可以使用
                alert(document.getElementById("customControl_XXX").attributes["value"].value);            //IE Firefox中均可使用
            }

            
            
//IE Firefox中均可使用
            function createYYYControl()
            
{
                
var cy = document.createElement("YYY");
                cy.id 
= "customControl_YYY";
                cy.value 
= "自定义元素yyy";
                cy.checked 
= true;
                document.body.appendChild(cy);
                
                alert(document.getElementById(
"customControl_YYY").value);
                alert(document.getElementById(
"customControl_YYY").checked);
            }

        
</script>
    
</head>
    
<body>
        
<xxx id="customControl_XXX" value="自定义元素xxx"></xxx>
        
<input type="button" value="取得xxx元素的值" onclick="getXXXValue();">
        
<input type="button" value="生成yyy元素并取得该元素的值" onclick="createYYYControl();">
    
</body>
</html>

源代码
:http://files.cnblogs.com/redleaf1995/CustomHtmlControl.rar
posted on 2008-04-17 11:28 红色枫叶 阅读(210) 评论(3)  编辑 收藏 网摘 所属分类: javascript、Web页面设计开发

FeedBack:
#1楼  2008-04-17 11:58 李战      
路过,学习啦。
  回复  引用  查看    
#2楼  2008-09-05 09:44 serryzhao [未注册用户]
好像<select>中的自定义不行,有什么解决办法吗?谢谢
  回复  引用    
#3楼  2008-09-05 10:15 serryzhao [未注册用户]
解决了
document.getElementById("").options[document.getElementById("").selectedIndex].attributes[""].value 呵呵。谢谢你给的启示
  回复  引用    

标题  
姓名  
主页
Email (博主才能看到) 
验证码 *  看不清,换一张 [登录][注册]
内容(请不要发表任何与政治相关的内容)  
  登录  使用高级评论  新用户注册  返回页首  恢复上次提交      
"五向定位"职业成长路线公开课(上海、南京、大连)
Google站内搜索


相关链接: