JavaScriptにおけるDOMとは何か

DOMに関して理解するためには、オブジェクトの中にプロパティがある、という状態をしっかりと理解している必要があります。
逆に言えばそれがわかってれば何も難しくないです。HTMLをオブジェクト扱いすること=DOMです。

DOMとは

JavaScriptからHTMLにアクセスする際、JavaScriptとしてはなんらかのオブジェクトのメソッドを実行したりプロパティを変更したりしたいわけです。なので、HTMLの中のbodyの中のstyleの中のborderの値をちょっとこうしたい、ドキュメント（=HTMLページ）をオブジェクトとして扱うことにする、すなわちDocument Object Model、略してDOMです。
オブジェクトというのはデータの集まりで、「操作できる何か」です。bodyオブジェクトの中のstyleオブジェクトの中のborderがプロパティとなりますが、プロパティもオブジェクト的にふるまうことができるので、プロパティにプロパティがあったりします（例えば、変数に入力した数値にも「長さ」というプロパティがあったりする）。

DOMの中でhtmlは構造に合わせてツリー化され、これをDOMツリーと呼びます。documentが最も上位にあり、その下にhtml、その下にheadとbody、その下はmetaやh1、pやdivに細分化されていきます。
これらhtmlのオブジェクトに対して、JavaScriptからはIDを検索したり、タグ検索したり、あるいは逆にツリーに要素を追加したりといった「動的な」制御を加えていくことができます。なのでDOM取得と言ったらHTMLやCSSに関与する準備をすることですし、DOM操作と言ったら何か変更を加えることです。
DocumentからdivタグのIDを取得し、文章を追加する方法はこちら↓

JavaScriptからHTMLやCSSを変更する方法/getElementById()メソッドの使い方

あらかじめHTMLでボタンや画像に任意のID等を付けておいて、それをJavaScriptで読み取ることでJavaScriptとHTML/CSSの橋渡しをすることができます。

document.body.style.backgroundcolor（ドキュメント＝HTML文書の本文の、スタイルの背景色）を変更する記事はこちら↓
（DOMツリーはこのように、ひとつずつ下部のオブジェクトを追加して目的のプロパティまで下ります）

JavaScriptで要素の背景色を変更する方法/style.backgroundColorの使い方

JavaScriptを経由して要素（divやbody等）の背景色を変更する方法のご紹介です。html、css、JavaScript全て使用します。

とりあえずこのへんを一回やってみてもらえると、たぶん話が早いです。どちらも「マウスをクリックする」というイベントに対してonClickというイベントハンドラが起動し、DOM操作が実行されています。
たとえばダブルクリックしたとかページを読み込んだとかだと、イベントハンドラもondblclickやonloadなど変化します。
文章や画像が変更でき、要素のCSSを変更でき、さらにそのイベントが発生する原因も数多く知っていれば、相当バリエーション豊かな変更をページに施すことが可能です。