JavaScript是一種基于對象和事件驅動的編程語言，可以在網頁中實現動態交互效果。而JavaScript的DOM則是網頁開發中非常重要的一部分，它能夠讓我們通過代碼來對HTML頁面上的元素進行操作和修改。

如下所示，我們可以通過JavaScript來實現更改頁面上某個元素的背景顏色：

<code>let element = document.getElementById("my-element"); 
element.style.backgroundColor = "red";</code>

在這里，我們使用了document對象來獲取頁面中id為"my-element"的元素，隨后使用.style屬性去改變該元素的背景顏色。這個簡單的例子展示了JavaScript DOM的一些基本概念，如何通過JS代碼來找到一個元素以及如何修改樣式。

但事實上，DOM可以做的遠不止這些。我們可以通過DOM來創建、刪除和添加元素、修改元素的屬性、遍歷和查找元素等等。下面是一個示例，展示如何使用JavaScript DOM通過代碼來創建一個HTML元素：

<code>let div = document.createElement("div");
let text = document.createTextNode("This is some text");
div.appendChild(text);
document.body.appendChild(div);</code>

在這個例子中，我們使用了document.createElement()方法來創建一個名為“div”的HTML元素，同時創建了一個文本節點(text)。使用.appendChild()方法，我們將這個文本節點添加到了新創建的div元素中，接著我們又將這個新創建的div元素添加到了頁面的body元素中。

除了創建元素之外，我們還可以通過DOM來查找和修改元素的屬性。比如，我們可以使用document.getElementById()方法來找到一個id為“my-element”的元素，并使用.setAttribute()方法來給該元素設置一個新的class屬性：

<code>let element = document.getElementById("my-element");
element.setAttribute("class", "highlighted-element");</code>

在這個例子中，我們查找了一個id為“my-element”的元素，隨后使用.setAttribute()方法來給該元素設置了一個名為“highlighted-element”的class屬性值。

總體來說，JavaScript DOM是網頁開發中不可或缺的一部分，可以讓我們通過代碼來操作HTML頁面中的元素，實現網頁的動態效果。JavaScript DOM的操作方式非常豐富和靈活，使得我們能夠輕松地實現各種各樣的功能，同時也讓網頁開發變得更加高效和便捷。