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

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

    逆旅行人逆旅行人2021-04-15 13:57:41原创69

    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中文网其它相关文章!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    上一篇:如何使用javascript改变span标签中的值 下一篇:javascript输出语句有哪些
    第15期线上培训班

    相关文章推荐

    • javascript中怎么将xml转为json• javascript中怎么将字符串转为数字• javascript怎么实现页面跳转• javascript如何把时间戳转换为普通日期格式• javascript和java有什么区别• 如何使用javascript改变span标签中的值

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网