• 技术文章 >web前端 >js教程

    JavaScript中对HTML中元素属性的读取

    autoloadautoload2021-04-15 13:57:41原创516

    2021040716421270062.jpg

    JavaScript中,元素获取后,有些属性的值可以正常获取,但是有些属性的值进行访问后,得到的答案却是undefined,本文就带大家一起了解一下。

    表单中的内容:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title></title>
    </head>
    <body>
        <span  id="user"  data-email="a@qq.com" >jojo的奇妙</span>
        </body>
    </html>

    对表单中span标签属性数据进行读取:

     <script>
            const sp=document.querySelector("span");
            console.log(sp);
            console.log(sp.id);   
     </script>

    id可以正常获取

    <script>
            const sp=document.querySelector("span");
            console.log(sp.data-email);
    </script>

    报错:Uncaught ReferenceError: email is not defined,email的值无法获取。

    PS:id默认内置的标准属性,可以直接进行访问,email非内置属性,undefined

       <script>
            const sp=document.querySelector("span");
            console.log(p.dataset.email);
            //对于自定义的数据属性"data-",使用dataset对象来操作
       </script>

    推荐:《2021年js面试题及答案(大汇总)

    以上就是JavaScript中对HTML中元素属性的读取的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    上一篇:如何使用javascript改变span标签中的值 下一篇:javascript输出语句有哪些
    VIP课程(WEB全栈开发)

    相关文章推荐

    • 【腾讯云】年中优惠,「专享618元」优惠券!• javascript中怎么将xml转为json• javascript中怎么将字符串转为数字• javascript怎么实现页面跳转• javascript如何把时间戳转换为普通日期格式• javascript和java有什么区别• 如何使用javascript改变span标签中的值
    1/1

    PHP中文网