JavaScript <button>

2023-03-20 15:42 更新

<button>元素繼承了HTMLButtonElement接口。它有以下的實(shí)例屬性。

（1）HTMLButtonElement.accessKey

HTMLButtonElement.accessKey屬性返回一個(gè)字符串，表示鍵盤上對應(yīng)的鍵，通過Alt + 這個(gè)鍵可以讓按鈕獲得焦點(diǎn)。該屬性可讀寫。

（2）HTMLButtonElement.autofocus

HTMLButtonElement.autofocus屬性是一個(gè)布爾值，表示頁面加載過程中，按鈕是否會自動(dòng)獲得焦點(diǎn)。該屬性可讀寫。

（3）HTMLButtonElement.disabled

HTMLButtonElement.disabled屬性是一個(gè)布爾值，表示該按鈕是否禁止點(diǎn)擊。該屬性可讀寫。

（4）HTMLButtonElement.form

HTMLButtonElement.form屬性是一個(gè)表單元素，返回該按鈕所在的表單。該屬性只讀。如果按鈕不屬于任何表單，該屬性返回null。

（5）HTMLButtonElement.formAction

HTMLButtonElement.formAction返回一個(gè)字符串，表示表單提交的 URL。該屬性可讀寫，一旦設(shè)置了值，點(diǎn)擊按鈕就會提交到該屬性指定的 URL，而不是<form>元素指定的 URL。

（6）HTMLButtonElement.formEnctype

HTMLButtonElement.formEnctype屬性是一個(gè)字符串，表示數(shù)據(jù)提交到服務(wù)器的編碼類型。該屬性可讀寫，一旦設(shè)置了值，點(diǎn)擊按鈕會按照該屬性指定的編碼方式，而不是<form>元素指定的編碼方式。

該屬性可以取以下的值。

application/x-www-form-urlencoded（默認(rèn)值）
multipart/form-data（上傳文件的編碼方式）
text/plain

（7）HTMLButtonElement.formMethod

HTMLButtonElement.formMethod屬性是一個(gè)字符串，表示瀏覽器提交表單的 HTTP 方法。該屬性可讀寫，一旦設(shè)置了值，點(diǎn)擊后就會采用該屬性指定的 HTTP 方法，而不是<form>元素指定的編碼方法。

（8）HTMLButtonElement.formNoValidate

HTMLButtonElement.formNoValidate屬性是一個(gè)布爾值，表示點(diǎn)擊按鈕提交表單時(shí)，是否要跳過表單校驗(yàn)的步驟。該屬性可讀寫，一旦設(shè)置會覆蓋<form>元素的novalidate屬性。

（9）HTMLButtonElement.formTarget

HTMLButtonElement.formTarget屬性是一個(gè)字符串，指定了提交了表單以后，哪個(gè)窗口展示服務(wù)器返回的內(nèi)容。該屬性可讀寫，一旦設(shè)置會覆蓋<form>元素的target屬性。

（10）HTMLButtonElement.labels

HTMLButtonElement.labels返回NodeList實(shí)例，表示那些綁定按鈕的<label>元素。該屬性只讀。

/* HTML 代碼如下
  <label id="label1" for="test">Label 1</label>
  <button id="test">Button</button>
  <label id="label2" for="test">Label 2</label>
*/

const button = document.getElementById('test');

for(var i = 0; i < button.labels.length; i++) {
  console.log(button.labels[i].textContent);
}
// "Label 1"
// "Label 2"

上面代碼中，兩個(gè)<label>元素綁定<button>元素。button.labels返回這兩個(gè)<label>元素。

（11）HTMLButtonElement.name

HTMLButtonElement.name屬性是一個(gè)字符串，表示按鈕元素的name屬性。如果沒有設(shè)置name屬性，則返回空字符串。該屬性可讀寫。

（12）HTMLButtonElement.tabIndex

HTMLButtonElement.tabIndex是一個(gè)整數(shù)，代表按鈕元素的 Tab 鍵順序。該屬性可讀寫。

（13）HTMLButtonElement.type

HTMLButtonElement.type屬性是一個(gè)字符串，表示按鈕的行為。該屬性可讀寫，可能取以下的值。