溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

DOM操作學習與總結

發(fā)布時間:2020-07-18 09:32:33 來源:網(wǎng)絡 閱讀:390 作者:蝸牛oscersong 欄目:開發(fā)技術

Dom操作

(1)屬性操作:html元素由一個標簽和一組稱為屬性的名/值對組成,比如:<a>元素,它的href屬性值作為鏈接的目的地址。

   操作屬性有倆種方法:1)直接利用函數(shù),getAttribute();setAttribute();2)使用對象.屬性值,來進行操作屬性,取值或者設置值,簡單操作代碼如

DOM操作學習與總結      

     (2)內容操作:

          a)innerText:操作開始標簽與結束標簽之間的文本,對象.innerText=所要設置的文本內容,對象.innerText獲得文本內容,但是innerTextFirefox中不支持,其他瀏覽器中都可以使用,而在Firefox,使用textContent來代替innerText.

          b)innerHTML:操作開始標簽與結束標簽之間的內容,包括標簽文本。

          c)outerHTML:操作開始標簽與結束標簽之間的內容,包括標簽與文本,還有對象的標簽。

舉例子如下:

    DOM操作學習與總結

在使用innerText獲得標簽內的內容,如下圖顯示為“我是鏈接的內容”

DOM操作學習與總結

當把代碼中的alertaObj.innerHTML)使用后,效果圖如下:包含標簽與內容文本一起取出。

DOM操作學習與總結

當把代碼中的alertaObj.outerHTML)使用后,效果圖如下:包含對象本身標簽與,之間的標簽,內容文本一起取出。

DOM操作學習與總結

這個是使用innerText設置標簽內的內容,如下圖:

DOM操作學習與總結

通過aObj.innerHTML=<h3>內容</h3>設置內容時,會把標簽與內容一起解析,最后生成相對應效果的文本圖,

DOM操作學習與總結

現(xiàn)在,通過上面的三個例子,應該清楚了這三個的區(qū)別。

3)樣式操作:對象.style.backgroundColor=red;設置對象的背景顏色為紅色。

               對象.fontSize=20px”;設置對象的字體為20px.

               對象.className=test設置對象有test類的屬性。

               對象.className= ;  清除對象設置的類屬性樣式。

             


向AI問一下細節(jié)

免責聲明:本站發(fā)布的內容(圖片、視頻和文字)以原創(chuàng)、轉載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據(jù),一經查實,將立刻刪除涉嫌侵權內容。

AI