<body> …… 文書の本体（コンテンツ）を表す
広告
<body>タグは、文書の内容を表す際に使用します。
body要素は、html要素の直下に配置される2番目の子要素です。
標準的なHTML文書では、html要素の下の1番目にhead要素、2番目にbody要素が配置されます。
head要素はその文書に関するメタ情報ですが、
body要素はその文書の本体となるコンテンツそのものです。
body要素の配置ルール
body要素は、ひとつの文書内に1つだけ配置します。
body要素が空の場合、または、
body要素内の最初のものが
meta要素、
noscript要素、
link要素、
script要素、
style要素、
template要素、
ホワイトスペース、
コメント以外の場合には、
開始タグ<body>を省略できます。
</body> の省略について
body要素の直後にコメントがない場合は、
終了タグ</body>を省略できます。
■使用例
以下のサンプルは、典型的なHTML文書の一例です。
html要素直下の1番目にhead要素、2番目にbody要素を配置しています。
HTMLソース
<!DOCTYPE html>
<html lang="ja">
<head>
<title>サンプルページ</title>
</head>
<body>
<h1>サンプルページ</h1>
<p>これは<a href="demo ">シンプルな</a> サンプルです。</p>
<!-- ここはコメントです -->
</body>
</html>■属性
- onafterprint
- 印刷後にイベント指定
- onbeforeprint
- 印刷前にイベント指定
- onbeforeunload
- ページがアンロードになろうとしているときにイベント指定
- onhashchange
- 文書のURLが変更されたときにイベント指定
- onlanguagechange
- 優先言語が変更されたときにイベント指定
- onmessage
- メッセージを受信したときにイベント指定
- onmessageerror
- 逆シリアル化できないメッセージを受信したときにイベント指定
- onoffline
- ネットワーク接続が失敗したときにイベント指定
- ononline
- ネットワーク接続が回復したときにイベント指定
- onpagehide
- ページのセッション履歴エントリがアクティブなエントリでなくなったときにイベント指定
- onpageshow
- ページのセッション履歴エントリがアクティブなエントリになったときにイベント指定
- onpopstate
- セッション履歴トラバーサルのときにイベント指定
- onrejectionhandled
- 未処理のPromise拒否が処理されるようになったときにイベント指定
- onstorage
- 対応する localStorage または sessionStorage ストレージ領域が変更されたときにイベント指定
- onunhandledrejection
- 未処理のPromise拒否が処理されないままのときにイベント指定
- onunload
- ページが消えていくときにイベント指定
以下のサンプルでは、body要素のononline属性とonoffline属性を使って、ユーザーがいまオンラインかオフラインかを表示し分けています。
■使用例
HTMLソース
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>オンライン？オフライン？</title>
<script>
function update(online) {
document.getElementById('status').textContent =
online ? 'オンライン' : 'オフライン';
}
</script>
</head>
<body ononline="update(true)"
onoffline="update(false)"
onload="update(navigator.onLine)">
<p>あなたはいま <strong id="status">（不明）</strong> です。</p>
</body>
</html>↓↓↓
ブラウザ上の表示
■関連項目
- <!DOCTYPE html> …… 文書型宣言を表す
- <html> …… HTML文書であることを表す
- <head> …… 文書のヘッダ情報を表す
- <body> …… 文書の本体（コンテンツ）を表す
広告