1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

JavaScriptを基本からまとめてみた【1】【DOM】【随時更新】

Last updated at Posted at 2021-07-14

##はじめに

####学習するに至った経緯

2020年より、未経験からエンジニアへの転職を目指し、某プログラミングスクールへ通う。
入学後、『Ruby』を未経験から学ぶ人が多いのと『Ruby』の求人が思っていた以上に少ないので、
卒業後、フロントエンドのエンジニアを目指す事に。
Javascriptの学習した事を言語化し、認識の深化による備忘録として記載。

##DOMとは
Document Object Model」の略。直訳すると、「ドキュメントを物として扱うモデル」。
JavaScriptでhtmlの要素を操作するための仕組みのこと。htmlなどを解釈し、木構造で表現したもの。
JavaScriptからHTMLドキュメントを操作するためのAPI(インターフェイス)。
##DOMの特徴
① ツリー構造とも呼ばれる階層構造を取る。
② それぞれノードという言葉で説明される。
③ WEBページとJavaScriptなどのプログラミング言語とを繋ぐ。

基本的にDOMを追加していく場合は、

・document.elementById: (id要素を指定)
・createElement: (要素を作成)
・textContent: (要素の中身を定義)
・appendChild: (親要素に追加する)
の四点セットの流れが必要です。

##参考サイト
[JavaScript初心者でもすぐわかる!DOMとは何か?]
(https://eng-entrance.com/what-is-dom)
[【JavaScript: ToDoリスト】table要素を理解してToDoを表示させる方法]
(https://ina-yona-mochiko.com/programming/javascript/todolist-table/)

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?