读取css的默认属性和自定义属性

最新推荐文章于 2025-03-08 23:50:53 发布

congboer

最新推荐文章于 2025-03-08 23:50:53 发布

阅读量819

点赞数

CC 4.0 BY-SA版权

分类专栏： js 文章标签：默认属性自定义属性读取设置 css

本文链接：https://blog.youkuaiyun.com/congboer/article/details/96475124

js 专栏收录该内容

15 篇文章

订阅专栏

本文介绍了如何使用JavaScript读取HTML元素的默认CSS属性和自定义属性。包括使用点操作符、getAttribute方法等来读取和修改属性值。并区分了不同浏览器下自定义属性的表现差异。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

读取css的默认属性和自定义属性

<body>
    <a href="http://www.baidu.com" target="_blank" title="链接的解释" aaa="bbbb">link</a>
    <script>
        var oA=document.querySelector('a');
        // alert(oA);//http://www.baidu.com  oA：元素对象

        //1.读写元素对象的默认属性。
        // alert(oA.target);
        // alert(oA['target']);
        // alert(oA.title);
        // oA.title='我是新的链接的解释';//用点操作符设置属性
        // alert(oA.getAttribute('title'));//链接的解释

        //2.读写自定义的属性
        //2.1 setAttribute() getAttribute()  removeAttribute():读写删默认的和自定义的属性。
        //alert(oA.aaa);//undefined 无法获取自定义的属性,点操作符和[]只能够读取默认的属性。

        //alert(oA.getAttribute('aaa'));//bbbb
        //oA.setAttribute('num',100);//设置自定义属性，标签下面可见的。
        //oA.removeAttribute('aaa');


        //2.2 通过js的点操作符或者中括号添加自定义的属性，这种可以获取到，但在后台看不到
        //IE8及以下浏览器可以看到。其它浏览器看不到
        // oA.hehe='haha';
        // oA.name='zhangsan';
        // oA['age']=1000

        // alert(oA.hehe);
        // alert(oA.name);
        // alert(oA.age);
    </script>
</body>