Sibainu Relax Room

愛犬の柴犬とともに過ごす部屋

JavaScript XHTML とHTML5 変換

一昨日の朝の散歩です。初詣に合わせてでている出店を見て「あれは何なんだ」と聞きたがっている顔している柴犬です。

概要

昨年末に古い2009発行の「JavaScript & Ajax プロが教える”本当の使い方”」を手に入れました。

この本の特徴

JavaScriptのノウハウを、制作サンプルとともにステップ・バイ・ステップ形式で丁寧に解説したテクニック集であること。

JavaScriptライブラリやAjaxを効果的に活用したテクニックも紹介していること。

掲載サンプルをダウンロードできること。

これを読んでみて、これまで自己流で書いてきたコードの下手さ加減を思い知ることとなりました。

私のとって貴重な知識を得ることができました。

この中の例題がXTHLとなっていたのでHTML5との違いも調べる契機となりましたので、記録することにします。

XHTMLからHTML5への変換は次の見出し以降のようにすればよいようです。

大変勉強になりました。

ここに書いてあることは、今でも色あせていないと感じました。

DOCTYPEの宣言

ファイルのトップ部分です。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

を次のようにしました。

<!DOCTYPE html>

htmlタグ

lang属性だけでいいようです。

<html xmlns="http://www.w3.org/1999/xhtml">

を次のようにしました。

<html lang="ja">

metaタグの簡素化

charset属性だけでいいようです。

<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

を次のようにしました。

<meta charset="UTF-8">

linkタグのtype属性

type属性は不要なようです。

<link href="layout.css" rel="stylesheet" type="text/css"/>

を次のようにしました。

<link href="layout.css" rel="stylesheet">

scriptタグのtype属性

type属性は不要なようです。

<script src="form_validation.js" type="text/javascript"></script>

を次のようにしました。

<script src="form_validation.js"></script>

XHTMLでは「タグはすべて閉じる」

XHTMLでは「タグはすべて閉じる」という規則がありましたが、HTML5ではその必要性がないものもありす。したがって、inputタグの最後の / がなくでもHTML5ではOKです。

<input name="last_name" type="text" style="width:80px;" />

を次のようにしました。

<input name="last_name" type="text" style="width:80px;">

<br/>と<br>はよく見ますが、<br/>はXHTML名残りでHTML5ではどちらでもOKです。

<br/>

を次のようにしました。

<br>