JS--dom對象:document object model文檔對象模型

来源:https://www.cnblogs.com/xiqoqu/archive/2018/05/18/9058277.html
-Advertisement-
Play Games

dom對象:document object model文檔對象模型 文檔:超文本標記文檔 html xml 對象:提供了屬性和方法 模型:使用屬性和方法操作超文本標記性文檔 可以使用js裡面的DOM提供的對象,使用這些對象的屬性和方法,對標記性文檔進行操作 想要對標記性文檔進行操作,首先需要對標記性 ...


dom對象:document object model文檔對象模型
文檔:超文本標記文檔 html xml
對象:提供了屬性和方法
模型:使用屬性和方法操作超文本標記性文檔
可以使用js裡面的DOM提供的對象,使用這些對象的屬性和方法,對標記性文檔進行操作
想要對標記性文檔進行操作,首先需要對標記性文檔裡面的所有內容封裝成對象
對HTML 標簽 屬性 文本內容都封裝為對象
要想對標記性文檔進行操作,解析標記性文檔
--使用DOM解析HTML過程
根據HTML的層級結構,在記憶體中分配一個樹形結構,需要把HTML中的每部分封裝成對象
document對象,整個文檔
write():向頁面輸出變數(值/html代碼)
getElementById("標簽裡邊的id的值");通過id得到標簽(元素)
獲得屬性值,標簽對象.屬性名稱;
設置屬性值,標簽對象=值;
getElementsByName("標簽裡邊的name的值");返回值是數組
getElementsByTagName("標簽名稱")返回值是數組
element對象:元素(標簽)對象
getAttribute("屬性名稱"):獲得屬性裡面的值 input1.getAttribute("value");
setAttribute("屬性名稱","屬性值")設置屬性裡面的值
removeAttribute("name");刪除屬性得值,但是不能刪除value裡面的值

屬性對象
getAttributeNode("屬性名稱");

文本對象
--Node節點對象,這個對象使這些對象的父對象
如果在對象裡面找不到想要的方法,這個時候到Node對象裡面去找
nodeName string 節點的名字,根據節點的類型而定義
nodeValue string 節點的值,根據節點的類型而定義
nodeType number 節點的類型常量值之一
ownerDocument Document 指向這個節點所屬的文檔
//獲取文本節點
firstChild Node 指向在childNodes列表中的第一個節點
lastChild Node 指向在childNodes列表中的最後一個節點

-childNodes NodeList 所有子節點的列表,但是瀏覽器相容性很差
-parentNode Node 返回一個給定節點的父節點
previousSibling Node 指向前一個兄弟節點,如果這個節點就是第一個兄弟節點,那麼該值為null
nextSibling Node 指向後一個兄弟節點,如果這個節點就是最後一個兄弟節點那麼該值為null

hasChildNodes Boolean 當childNodes包含一個或多個節點時,返回true
attributes NameNodeMap 包含了代表一個元素的特性的Attr對象,僅用於Element節點
appendChild(node) Node 將node添加到childNodes的末尾
removeChild(node) Node 從ChildNodes中刪除node
replaceChild(newnode,oldnode) Node 將ChildNodes中的oldnodes替換成newnodes
insertBefore(newnode,refnode) Node 在childNodes中 的refnode之前插入newnode

Node對象屬性
nodeName
nodeType
nodeValue

<script type="text/javascript">
//獲取標簽對象
var span1 = document.getElementById("spanid");
alert(span1.nodeType);//1
alert(span1.nodeName);//SPAN
alert(span1.nodeValue);//null

//屬性
var id1 = span1.getAttributeNode("id");
alert(id1.nodeType);//2
alert(id1.nodeName);//id
alert(id1.nodeValue);//spanid

//文本
var text1 = span1.firstChild;
alert(text1.nodeType);//3
alert(text1.nodeName);//#text
alert(text1.nodeValue);//文本內容
</script>
<span id="spanid">哈哈呵呵</span>


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 查看是否有mysql軟體 刪除舊版本mysql 選擇一個發佈系列 安裝MySQL 啟動MySQL伺服器登錄 沒有問題不需要這兩步 > setenforce 1 > rm -fr /var/lib/mysql/* > sudo service mysqld start Starting mysqld: ...
  • MySQL資料庫引擎、事務隔離級別、鎖 資料庫引擎InnoDB和MyISAM有什麼區別 大體區別為: MyISAM類型不支持事務處理等高級處理,而InnoDB類型支持。MyISAM類型的表強調的是性能,其執行效率比InnoDB類型更快,但是不支持事務,而InnoDB提供事務支持以及外鍵等高級資料庫功 ...
  • 再寫MapReduce執行流程之前,首先先對MapReduce有一些瞭解: 1. 簡介 MapReduce是一個計算框架,既然是做計算的框架,那麼表現的形式上就有輸入,操作輸入,得到結果2.主從結構 a.Hadoop1.0 MapReduce是主從結構,Hadoop1.0的主是JobTracker, ...
  • 寫這篇隨筆的目的是我發現了在上一篇關於My SQL的隨筆中存在一些不嚴謹的代碼問題,在這裡再次簡單的總結一下並加以改進,以代碼為主。 # !每行命令必須以分號(;)結尾 先通過命令行進入資料庫客戶端 mysql -h服務端ip地址 -P(大寫)服務端使用的埠,一般為3306 -p(小寫) 回車之後 ...
  • 一、知識介紹 1、【廣播分類】 ①有序廣播:接收者A收到廣播傳遞給B,B傳給C,有序傳遞。任何一個環節都可以終止廣播,也可以修改廣播中攜帶的數據。 發送的方式:sendOrderedBroadcast(intent,receiverPermission); 【提示】①第二個參數是設置發送的許可權,這裡 ...
  • 一、知識介紹 1、broadcastReceiver是廣播接受者,四大組件之一。 2、Android中內置了很多系統級別的廣播,可以在應用程式中得到各種系統的狀態信息。 3、使用場景: ①當手機沒有電時,會告知用戶“電量低”的廣播信息。可以做到正在使用的app就會接收到這個廣播消息,如果是游戲可能是 ...
  • 使用Chrome Inspect調試混合應用可以幫助我們排查問題。例如定位元素,快速修改CSS樣式並實時查看效果。其實微信開發也是一種混合開發模式,微信可以看做一個原生的Android App搭配了一個JS運行環境(WebView),然後大家就可以愉快地使用Web前端技術(Html/Css/Js)開 ...
  • 在大型商場,醫院或是大樓里,你是否曾經有過找不到想去的地方的經歷呢?這種情況下採用傳統的定位方法就有些力不從心了。首先這些地方不能採用GPS定們,而Wifi和蜂窩式行動電話基站定位誤差比較大。這種情況下的定位就叫”微定位“技術 。 微定位技術中一個比較重要的概念-地理圍欄。地理圍欄是LBS的一種新應 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...