码迷,mamicode.com
首页 > 编程语言 > 详细

javascript——DOM之操作属性的多种方式

时间:2015-03-04 14:25:00      阅读:143      评论:0      收藏:0      [点我收藏+]

标签:

获取和设置元素的方法:. [] getAttribute

具体实例:

HTML部分:

<input type="text" id="text1" value="text" _name_="自定义属性" /><br><br>
<img src="images/pic.jpg" id="img1" style="width:180px" />

JS部分:

window.onload = function(){
        
        var oText = document.getElementById(‘text1‘);

        // 获取和设置元素的方法:. []
        
        // alert(oText.value);
        // oText.value = ‘文本框‘;

        // alert(oText[‘value‘]);
        // oText[‘value‘] = ‘文本框‘;

        // var name = ‘value‘;
        // alert(oText.name);        //有问题
        // alert(oText[name]);        //OK

        /*
            元素.getAttribute(属性名称); 方法 获取指定元素的指定属性的值
        */

        // alert(oText.getAttribute(‘value‘));            //text


        /*
            元素.setAttribute(属性名称,属性值); 方法 给指定元素指定的属性设置值
        */

        // oText.setAttrbute(‘value‘ ,‘文本框‘);

        /*
            元素.removeAttribute(属性名称); 方法 移除指定的元素的指定的属性
        */
        // oText.removeAttribute(‘value‘);

        /*
        1.用.和[]的形式无法操作元素的自定义属性
            getAttribute可以操作元素的自定义属性
        */
        // alert( oText._name_ );
        // alert( oText[‘_name_‘] );
        // alert(oText.getAttribute(‘_name_‘));

        var oImg = document.getElementById(‘img1‘);

        /*
            可以获取元素属性实际的值
            ie7下还是会返回资源的绝对路径
        */

        // alert(oImg.src);
        // alert(oImg[‘src‘]);
        // alert(oImg.getAttribute(‘src‘));
        // alert(oImg.style.getAttribute(‘width‘));        //仅IE会弹出180px

    };

 

javascript——DOM之操作属性的多种方式

标签:

原文地址:http://www.cnblogs.com/bokebi520/p/4313158.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!