其他分享
首页 > 其他分享> > js设置setAttribute、获取getAttribute、删除removeAttribute详细讲解

js设置setAttribute、获取getAttribute、删除removeAttribute详细讲解

作者:互联网

代码演示:

<!DOCTYPE html> <!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> <!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]--> <!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]--> <!--[if gt IE 8]>      <html class="no-js"> <!--<![endif]--> <html>     <head>         <meta charset="utf-8">         <meta http-equiv="X-UA-Compatible" content="IE=edge">         <title>js设置setAttribute、获取getAttribute、删除removeAttribute详细讲解 </title>         <meta name="description" content="">         <meta name="viewport" content="width=device-width, initial-scale=1">         <link rel="stylesheet" href="">     </head>     <body>         <div>             <input value="3652" id="inputdemo" type="password">             <input type="button" onClick="setClick()" value="点击设置">             <input type="button" onClick="getClick()" value="点击查询">             <input type="button" onClick="deleteClick()" value="点击删除">         </div>         <script>             var input = document.getElementById('inputdemo');             // setAttribute 设置input的type为file             function setClick() {                 input.setAttribute("type", "number")                     //自定义属性值                 input.setAttribute("aa", "bb")             }                           function getClick() {                 // getAttribute 输出input的type类型是password                 console.log(input.getAttribute("type"));             }                 //removeAttribute 删除input的value值             function deleteClick() {                 input.removeAttribute("value")                 input.removeAttribute("type")                 input.removeAttribute("ccc")             }         </script> </html>     理解:      ##  setAttribute的理解      所有主流浏览器均支持 setAttribute() 方法。     element.setAttribute(keys,cont)     keys==>必需(String类型)。您希望添加的属性的名称     cont==>必需(String类型)。您希望添加的属性值     使用场景:可以设置元素的属性类型。     <input value="3652" id="inputdemo" type="password">     最初是密码框,我们使用这个方法可以设置为file类型     同时它也可以设置自定义的属性值     比如     inputdemo.setAttribute("aa", "bb")

    ## getAttribute
    获取元素的属性值,如果存在返回对应的值     不存在返回null     <input value="3652" id="inputdemo" type="password">     返回password哈     console.log(input.getAttribute("type"));     由于不存在aa这个属性,所以返回null     console.log(input.getAttribute("aa"));

    ## removeAttribute       删除属性值;     如果移除不存在的属性值,并不会报错的哈。     在echarts中就会使用removeAttribute这个方法     主要是处理echarts第二次不会渲染

标签:removeAttribute,getAttribute,setAttribute,input,type,属性
来源: https://www.cnblogs.com/yxlbk/p/16561582.html