天天看點

原生js增加html,原生JS“增加/擷取/修改/删除”元素屬性方法

今天在做Ajax三級關聯的時候,項目要求:最初剛打開頁面的時候,後面兩個關聯要麼 disabled="disabled" 禁用,要麼用 hidden="hidden" 來隐藏......以此類推。

經過大量的測試,最後決定用 disabled="disabled" 禁用元素,因為用 hidden="hidden" 來隐藏元素,AJAX POST 請求的資料伺服器照樣能接收到,這點不是很友好。

當然了,disabled="disabled" 與  hidden="hidden"  一起用,也能達到背景既不接收ajax傳過來的資料,三級關聯也不會一起顯示讓使用的效果,想想沒有必要搞重複的功能吧!

注意:

disabled 屬性無法與 input type="hidden" 一起使用,卻可以與 hidden="hidden" 一起使用。

下面再給大家簡單補充一點基礎知識:

1、什麼是DOM元素?

一個DOM元素就像一個頁面上的DIV,HTML,BODY元素。可以使用CSS為所有這些類添加類,或者使用JS與它們互動。

2、什麼是DOM元素 屬性?

簡單來說,屬性就是 DOM元素 裡面的東西。

例如:

input标簽就是“DOM元素”。

input标簽裡面的:required、maxlength、pattern、id、class、title.......就是“DOM元素 屬性”。

我的html代碼:

四川

遼甯

一、JS 擷取屬性名 方法

document.getElementById("province").getAttribute("屬性名");

示例:

document.getElementById("province").getAttribute("disabled");

二、JS 增加、設定或修改屬性值 的方法

document.getElementById("province").setAttribute("屬性名","屬性值");

示例:

document.getElementById("province").setAttribute("disabled","disabled");

三、JS 移除或删除屬性 的方法

document.getElementById("province").removeAttribute("屬性名");

示例:

document.getElementById("province").removeAttribute("disabled");

總結:

如果你想用js擷取自定義屬性也可以嘗試用此文章方法,雖然我還沒有親自測試過。