大家都知道disabled屬性用來禁用表單里的元素。如果讓你來禁用一個表單元素,你會怎么做么,下面提供幾種寫法,各位看官請看
html: <button type='button'>test</button>
var btn=document.querySelector('button');
1. btn.disabled=true;
2. btn.disabled='disabled';
3. btn.setAttribute('disabled',true);
4. btn.setAttribute('disabled','disabled')
經過試驗,上述幾種寫法都生效了,我們都知道,在html5中disabled是一個布爾值,上述幾種寫法渲染出來之后,在他的properties里可以查看到這些都是為true,3,4,方法中,元素的標簽上分別為
3. <button type='button' disabled='true'>test</button>
4. <button type='button' disabled='disabled'>test</button>
如果要重新激活這個按鈕的話,你可能看到過下面的幾種寫法
1. btn.disabled=false;
2. btn.disabled="";
3. btn.setAttributed('disabled',false);// 不生效
4. btn.removeAttribute('disabled');
這個時候就有小伙伴站出來了,第三種寫法為什么不生效呢???
其實是這樣子的,在html5里面,disabled是一個布爾值,我們可以設置他的值為true或者false,而在XHTML里面disabled是一個常規的屬性,設置他的值就是用setAttribute,所以用setAttribute('disabled',false) 是不生效的
所以,正規的寫法是
1. btn.disabled=true;
btn.disabled=false;
2. btn.setAttribute('disabled','disabled');
btn.removeAttribute('disabled');