HTMLにおいて、どこにも書いていない要素をjsで作り出すことができる。
document.createElement('p');
var ele = document.createElement('p');
appendChild(アペンドチャイルド)
親要素.appendChild (子要素)
>appendChildは、特定の親要素の中に要素を追加するためのメソッドです。
要素を指定し、その要素の子要素として、HTMLタグを追加することができます。
追加される場所は、親要素の末尾です。
つまり指定した要素の閉じタグの直前ですね。
>innerHTMLとは?
HTML要素の中身を変更するためのプロパティ。
要素の中身を取得したり変更したりする事ができる。
--->test2.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>繰り返し処理</title>
<link rel="stylesheet" href="test2.css">
</head>
<body>
<ul id="hoge"></ul>
<script src="test2.js"></script>
</body>
</html>
--->test2.js
var ul1 = document.getElementById('hoge');//divに書き出す部分の親要素
//子要素
var i;//ループカウンタ
for (i=0; i<20; i++){
var ele = document.createElement('li');//p要素をオブジェクトとして新規に生成する、
ele.innerHTML ='hogehoge';//オブジェクトeleのプロパティにhogehoge
ul1.appendChild(ele);
}
--->
>getElementByIdは、任意のHTMLタグで指定したIDにマッチする
ドキュメント要素を取得するメソッドです。
引数としてIDであるStringオブジェクトを要し、戻り値は取得した要素です。任意の要素を抽出し、その内容を変更したい場合など、様々なシチュエーションで活躍する関数です。
基本的にIDはドキュメント内で重複してはならないので、getElementByIdによって取得される要素は一つです。
margin(マージン)外側
padding(パディング)内側 詰め物のこと
横幅=文字が表示できる領域
プラスでつめものが入ると超過してしまう。