導航:首頁 > 使用方法 > dom常用方法

dom常用方法

發布時間:2022-01-07 06:45:38

① 常用的 HTML DOM 屬性是什麼

常用的屬性有,innerHTML屬性、nodeName屬性、nodeValue屬性、nodeType屬性等。

1、innerHTML屬性,是獲取元素內容的最簡單方法。innerHTML 屬性對於獲取或替換 HTML 元素的內容很有用。

2、nodeName屬性,規定節點的名稱。nodeName 是只讀的。

3、nodeValue屬性,規定節點的值。對於元素類型的節點,其nodeValue 是 undefined 或 null;對於文本類型的節點,其nodeValue 是文本本身;對於屬性類型的節點,其nodeValue是屬性值。

4、nodeType屬性,返回節點的類型。nodeType 是只讀的。比較重要的節點類型有,元素(類型值為1),屬性(類型值為2),文本(類型值為3),注釋(類型值為8),文檔(類型值為9)。

(1)dom常用方法擴展閱讀

1、DOM屬性訪問方式

可通過 JavaScript (以及其他編程語言)對 HTML DOM 進行訪問。所有 HTML 元素被定義為對象,而編程介面則是對象方法和對象屬性。方法是您能夠執行的動作(比如添加或修改元素)。屬性是您能夠獲取或設置的值(比如節點的名稱或內容)。

2、DOM其他屬性

innerText屬性設置或獲取位於對象起始和結束標簽內的文本,disabled屬性獲取表明用戶是否可與該對象交互的值,nextSibling屬性獲取對此對象的下一個兄弟對象的引用,tagName屬性獲取對象的標簽名稱。

參考資料

網路-DOM

② 常用的 HTML DOM 方法有哪些

常用的 HTML DOM 方法:

③ DOM常見的操作方式有哪些

為什麼非得移動一行呢?如果你只是想切換tr內的td的innerhtml的話,做起來應該是很簡單的,
如果你真要移動行的話,你可以搜索下「table拖拽」關鍵字。有很多相關的代碼。
再給你個這種思路吧:
<html>
<head>
<script>
function table_tb(th)
{
var str_tb='<table width="50" height="50" border="1" id="xm">';
var str_tr1='<tr id="t1"><td id="n1">1</td></tr>';
var str_tr2='<tr id="t2"><td id="n2">2</td></tr>';
var str_tr3='<tr id="t3"><td id="n3">3</td></tr>';
var str_tr4='<tr id="t4"><td id="n4">4</td></tr>';
var str_tr5='<tr id="t5"><td id="n5">5</td></tr>';
var str_tr6='<tr id="t6"><td id="n6">6</td></tr>';
var str_tb2='</table>';
var tb=str_tb+str_tr1+str_tr2+str_tr3+str_tr4+str_tr5+str_tr6+str_tb2;
switch(th)
{
case '1':
break;
case '2': tb=str_tb+str_tr2+str_tr3+str_tr4+str_tr5+str_tr6+str_tr1+str_tb2;
break;
case '3': tb=str_tb+str_tr3+str_tr4+str_tr5+str_tr6+str_tr1+str_tr2+str_tb2;
break;
case '4': tb=str_tb+str_tr4+str_tr5+str_tr6+str_tr1+str_tr2+str_tr3+str_tb2;
break;
case '5': tb=str_tb+str_tr5+str_tr6+str_tr1+str_tr2+str_tr3+str_tr4+str_tb2;
break;
case '6': tb=str_tb+str_tr6+str_tr1+str_tr2+str_tr3+str_tr4+str_tr5+str_tb2;
break;
default :
break;
}
window.test.innerHTML=tb;
}
</script>
</head>
<body>
<form name="yunxin" method="post" action="" class="center">
小車號
<select name="select" id="xc" size="1" onchange="table_tb(this.value);">
<option value="1" selected id="chehao">1</option>
<option value="2" id="chehao">2</option>
<option value="3" id="chehao">3</option>
<option value="4" id="chehao">4</option>
<option value="5" id="chehao">5</option>
<option id="chehao" value="6">6</option>
</select>
</form>
<div id='test'>
<table width="50" height="50" border="1" id="xm">
<tr id="t1"><td id="n1">1</td></tr>
<tr id="t2"><td id="n2">2</td></tr>
<tr id="t3"><td id="n3">3</td></tr>
<tr id="t4"><td id="n4">4</td></tr>
<tr id="t5"><td id="n5">5</td></tr>
<tr id="t6"><td id="n6">6</td></tr>
</table></div>
</body>
</html>
動態的也一樣行啊。。。只要在函數里動態得到內容不就得了,document.getElementById('n1').innerhtml
如果還不滿意,那你找『table拖拽』代碼吧。

④ 什麼是dom,html中三種常見的dom節點

DOM( Document Object Model)是通過 JavaScript,您可以重構整個 HTML 文檔。您可以添加、移除、改變或重排頁面上的項目。
要改變頁面的某個東西,JavaScript 就需要獲得對 HTML 文檔中所有元素進行訪問的入口。這個入口,連同對 HTML 元素進行添加、移動、改變或移除的方法和屬性,都是通過文檔對象模型來獲得的(DOM)
根據 DOM,HTML 文檔中的每個成分都是一個節點。
DOM 是這樣規定的:
整個文檔是一個文檔節點
每個 HTML 標簽是一個元素節點
包含在 HTML 元素中的文本是文本節點
每一個 HTML 屬性是一個屬性節點
注釋屬於注釋節點

⑤ xml dom的方法和屬性常用的有哪些

XML主要用於數據的處理與表達.因為html等其它標記語言無法准確表達其本質內容,而主要是表現樣式.導致帶來很多不便.這樣,XML就誕生了.

⑥ 常見的DOM操作有哪些

前言

DOM(Document Object Model)即文檔對象模型,針對 HTML 和 XML 文檔的 API(應用程序介面)。DOM 描繪了一個層次化的節點樹,運行開發人員添加、移除和修改頁面的某一部分。DOM 脫胎於 Netscape 及微軟公司創始的 DHTML(動態 HTML),但現在它已經成為表現和操作頁面標記的真正跨平台、語言中立的方式。

閱讀目錄

基本概念
節點創建型api
頁面修改型API
節點查詢型API
節點關系型api
元素屬性型api
元素樣式型api

總結

文本整理了javascript操作DOM的一些常用的api,根據其作用整理成為創建,修改,查詢等多種類型的api,主要用於復習基礎知識,加深對原生js的認識。

基本概念

在講解操作DOM的api之前,首先我們來復習一下一些基本概念,這些概念是掌握api的關鍵,必須理解它們。

Node類型

DOM1級定義了一個Node介面,該介面由DOM中所有節點類型實現。這個Node介面在JS中是作為Node類型實現的。在IE9以下版本無法訪問到這個類型,JS中所有節點都繼承自Node類型,都共享著相同的基本屬性和方法。

Node有一個屬性nodeType表示Node的類型,它是一個整數,其數值分別表示相應的Node類型,具體如下:

Node.ELEMENT_NODE:1
Node.ATTRIBUTE_NODE:2
Node.TEXT_NODE:3
Node.CDATA_SECTION_NODE:4
Node.ENTITY_REFERENCE_NODE:5
Node.ENTITY_NODE:6
Node.PROCESSING_INSTRUCTION_NODE:7
Node.COMMENT_NODE:8
Node.DOCUMENT_NODE:9
Node.DOCUMENT_TYPE_NODE:10
Node.DOCUMENT_FRAGMENT_NODE:11
Node.NOTATION_NODE:12

假設我們要判斷一個Node是不是元素,我們可以這樣判斷
if(someNode.nodeType == ){ console.log("Node is a element"); }
這些Node類型中,我們最常用的就是element,text,attribute,comment,document,document_fragment這幾種類型。
我們簡單來介紹一下這幾種類型:

Element類型

Element提供了對元素標簽名,子節點和特性的訪問,我們常用HTML元素比如div,span,a等標簽就是element中的一種。Element有下面幾條特性:

(1)nodeType為1
(2)nodeName為元素標簽名,tagName也是返回標簽名
(3)nodeValue為null
(4)parentNode可能是Document或Element
(5)子節點可能是Element,Text,Comment,Processing_Instruction,CDATASection或EntityReference

⑦ js中常用DOM操作有哪些

DOM常用操作

查找節點

新建節點

添加節點

刪除節點

修改節點

我們用到最多的是element類型,用於表現HTML元素,提供了對元素標簽名、子節點及特性的訪問。

網頁鏈接

⑧ DOM是什麼

文件對象模型(DocumentObjectModel,簡稱DOM),是W3C組織推薦的處理可擴展置標語言的標准編程介面。

⑨ JS裡面的DOM操作是什麼

DOM(即 Document Object Mode) 是 W3C(萬維網聯盟)的標准。

DOM 定義了訪問 HTML 和 XML 文檔的標准:「W3C 文檔對象模型 (DOM) 是中立於平台和語言的介面,它允許程序和腳本動態地訪問和更新文檔的內容、結構和樣式。」

W3C DOM 標准被分為 3 個不同的部分:

其中,在HTMLDOM中,所有事物都是節點。DOM是被視為節點樹的HTML。


根據 W3C 的 HTML DOM 標准,HTML 文檔中的所有內容都是節點:

HTML DOM 將 HTML 文檔視作樹結構。這種結構被稱為節點樹。通過 HTML DOM,樹中的所有節點均可通過 JavaScript 進行訪問。所有 HTML 元素(節點)均可被修改,也可以創建或刪除節點。

DOM處理中的常見錯誤是希望元素節點包含文本。
舉個栗子:<title>DOM教程</title>,元素節點<title>,包含值為"DOM教程"的文本節點。
可通過節點的innerHTML屬性來訪問文本節點的值。

一些常用的 HTML DOM 方法:

一些常用的 HTML DOM 屬性:

DOM操作示例

<html>
<body>
<pid="p1">HelloWorld!</p>
<script>
document.getElementById("p1").innerHTML="Newtext!";
//內容變更為newtext
document.getElementById("p1").style.color="blue";
//藍色
</script>
</body>
</html>

⑩ DOM 是什麼

文檔對象模型(Document Object Model,簡稱DOM),是W3C組織推薦的處理可擴展標志語言的標准編程介面。在網頁上,組織頁面(或文檔)的對象被組織在一個樹形結構中,用來表示文檔中對象的標准模型就稱為DOM。

DOM可以以一種獨立於平台和語言的方式訪問和修改一個文檔的內容和結構。換句話說,這是表示和處理一個HTML或XML文檔的常用方法。有一點很重要,DOM的設計是以對象管理組織(OMG)的規約為基礎的,因此可以用於任何編程語言。

優點和缺點

DOM的優勢主要表現在:易用性強,使用DOM時,將把所有的XML文檔信息都存於內存中,並且遍歷簡單,支持XPath,增強了易用性。

DOM的缺點主要表現在:效率低,解析速度慢,內存佔用量過高,對於大文件來說幾乎不可能使用。另外效率低還表現在大量的消耗時間,因為使用DOM進行解析時,將為文檔的每個element、attribute、processing-instruction和comment都創建一個對象,這樣在DOM機制中所運用的大量對象的創建和銷毀無疑會影響其效率。

閱讀全文

與dom常用方法相關的資料

熱點內容
無痕祛斑的最佳方法 瀏覽:189
安裝天然氣表的正確方法 瀏覽:304
圖層蒙版使用方法 瀏覽:178
冬蟲夏草的使用方法 瀏覽:750
魚秋串食用方法 瀏覽:198
如何用多種說明方法描寫雪 瀏覽:232
99乘以16用簡便方法 瀏覽:604
山楂研究方法 瀏覽:362
萬用表的原理和使用方法 瀏覽:746
桂花栽培種植方法 瀏覽:279
多變數分析方法與應用 瀏覽:652
電腦電源雜訊測量方法 瀏覽:630
汽車座椅清洗方法有哪些 瀏覽:779
如何用線圈纏繞方法確定電流 瀏覽:421
電腦筆記本惡搞方法 瀏覽:654
如何長高方法12歲 瀏覽:400
真皮皮帶質量好不好的鑒別方法 瀏覽:916
脊柱炎物理治療方法 瀏覽:573
直接開平方法20道例題帶答案簡單 瀏覽:165
手動試壓泵安裝方法 瀏覽:218