Javascriptにてページ作成

Javascriptを用いて、
1)以下を中央ぞろえ
2)太字・(HTMLでの)フォント6程度の「タイトル」
3)ページを開いた際の時間が30以下で「画像1」
　30秒より後の場合は「画像2」を表示
4)3)の背景色を変更
5)最終更新日時を自動取得

といった条件を満たしたページを作成したいのです。

2)は検索して調べたところ、おおむね以下のような感じになると思います。

<script type="text/javascript">
<!--
dd = new Date();
mySeconds = dd.getSeconds();
myimg= '<img src="「画像1」" width= "x" height="y">';
myimg2= '<img src="「画像2」" width= "x" height="y">';
if(mySeconds<30){
document.write(myimg+"<br>");
}else{
document.write(myimg2+"<br>");
}
document.write(dd.toLocaleString() +"<br>");
// -->
</script>

そして5)の日時自動取得は
<script type="text/javascript">
<!--
document.write(document.lastModified);
// -->
</script>

こんな感じになると思うのですが。
それ以外の条件を満たすJavascriptで、ぴんとくるものが見つかりません。
他の条件はHTMLで記述するべき(HTMLのほうが楽？)ことなのでしょうか？

HTMLは基本的なことだけかじった程度の知識で、Javascroptというものに頭を悩ませています。
よろしくお願いします。

No.1 ベストアンサー 回答者： neko-ten 回答日時： 2013/07/04 16:22

基本的に静的要素はHTMLで各内容で、今回の内容なら

1)以下を中央ぞろえ
2)太字・(HTMLでの)フォント6程度の「タイトル」
はHTML+CSSで記述するべきです。
中央に記載したいのであれば、要素に対してtext-alignでcenterを指定するだけです。
タイトルであればHに対してスタイル定義を行います。

コンテンツを可変にする場合でも、デザインはCSSが基本。中身をJavaScriptで書き換えます。
デザインの随時変更だってCSSをJavaScriptで書き換えることになります。

＞2)は検索して調べたところ、おおむね以下のような感じになると思います。
3じゃないかな？
こういった条件分岐などの動的コンテンツはJavaScriptで作業することになるでしょう。

4)の背景色ですが、画像に背景色・・・？

＞HTMLは基本的なことだけかじった程度の知識で、Javascroptというものに頭を悩ませています。
そもそもJavaScriptはHTMLやCSSを理解していることが前提なんで、まずはそれをマスターするべき。
基本的にHTMLの要素を指定したりDOM掘ったりするのにHTML/CSSわからないとお話になりません。
順番が違います・・・。

この回答へのお礼

回答ありがとうございました。

実はこれ、個人でできそうだったら試しに作ってみましょう、という授業内容だったのです。
背景色については、画像の背景ではなく、ページ全体の背景色かもしれないです。
HTMLの基礎的なことだけをやって、Javascript使って何かしろ、という授業には、私自身辟易としたのですが。

とりあえず、HTMLとCSSの方向から、もう一度挑戦してみます。

お礼日時：2013/07/08 09:31