关于javascript:你不知道的js潜规则vue和react框架写多的进来看看

38次阅读

共计 907 个字符，预计需要花费 3 分钟才能阅读完成。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <button id="btn"> 加锁 </button>
        <button id="btn2"> 解锁 </button>
        <script>
            var oBtn = document.getElementById('btn');
            var oBtn2 = document.getElementById('btn2');
            oBtn.addEventListener('click',function(){oBtn.setAttribute('disabled',true)
            })
            oBtn2.addEventListener('click',function(){oBtn.setAttribute('disabled',false)
            })
        </script>
    </body>
</html>

// 点击加锁当前，给以后 dom 元素增加了 disabled=“true”属性。如下
<button id="btn" disabled="true"> 加锁 </button>

// 点击解锁当前，给以后 dom 元素增加了 disabled=“false”属性。如下
<button id="btn" disabled="false"> 加锁 </button>

然而。真正能起到成果的是上面的写法。
`

    oBtn.addEventListener('click',function(){oBtn.setAttribute('disabled',true)
        })
        oBtn2.addEventListener('click',function(){oBtn.removeAttribute('disabled')
        })

`
综上所述，起初我查看了对于 HTMLdom 元素官网文档。说的是只有设置
disabled=“disabled”, 或者就繁多的 disabled（目前很多浏览器都反对简写形式）能力将按钮禁用。至于如何设置回来，官网没说。然而实际上能够通过移除这个属性来达到成果。
对于常常写 vue 和 react 以及小程序等框架的来说，因为很容易弄混，所以这一点必须分明。

正文完