プロが教えるわが家の防犯対策術!

サイトを作成中です。
まず下記のとおりjqueryでheader、side、footerをインクルードしています。

<script>
$(function() {
$("#header").load("header.html");
$("#side").load("side.html");
$("#footer").load("footer.html");
});
</script>

次に、コピーライトの年を自動更新したく、footer.htmlの中にjavasprictを入れました。

Copyright&copy; 2014
 <script type="text/javascript" language="JavaScript">
<!--
TYnow = new Date();document.write( ' - ' + TYnow.getFullYear() );
// -->
</script> ○○○○ CO.,Ltd.

すると、全体が「-2017」としか表示されなくなってしまいました。
どうすればいいのでしょうか、どなたか教えて下さい。
宜しくお願いいたします。

A 回答 (5件)

こんにちは。



一旦、HTMLが読み込まれた後で document.write を実行すると、新しい文書が作成されます。そこに、-2017と書かれて、古い(それまで表示されていた)文書は捨てられます。

現在の文書の内容を変更したい場合は、document.getElementById などを用いて、DOMを取得し、内容を書き換えるようにしてください。
https://www.google.co.jp/search?q=javascript+文書+書き替え&oq=javascript+文書+書き替え&aqs=chrome..69i57.26265j0j4&client=ms-android-kddi-jp&sourceid=chrome-mobile&ie=UTF-8#xxri=2
    • good
    • 0
この回答へのお礼

早速に回答いただき、ありがとうございます。
ただ勉強不足のため「document.getElementById などを用いて、DOMを取得・・・」とか、その後の「https://www.google.co.jp/search?q=javascript+文書+・・・」とかがさっぱり意味不明でわかりません。
具体的にどうすればいいのか教えていただければ助かります。

お礼日時:2017/04/15 16:29

document.writeはhtmlソースコードなどを出力する為のものなんですがloadと組み合わせる場合には注意が要ります。



通常で書くと、さほど問題は置きないんですが、「ページの読み込み後に文字を挿入・・・」みたいな事をすると、真っ白になったり、挿入文字だけになったりします。

仕方無いのでフッターの全てをdocument.writeで吐き出します。

TYnow = new Date();document.write('Copyright&copy; 2014 - ' + TYnow.getFullYear()+' ○○○○ CO.,Ltd.' );
    • good
    • 0
この回答へのお礼

回答いただき、ありがとうございます。
フッターの全てをdocument.writeで吐き出すと、真っ白な背景に「Copyright(c) 2014 -2017 ○○○○ CO.,Ltd.」が表示されるだけで、他のheader、side、本文が表示されないのではないでしょうか?
それとも、「フッターの全てをdocument.writeで吐き出す」とは、<head>内の<script>の$("#footer").load("footer.html");の代わりに、TYnow = new Date();document.write('Copyright&copy; 2014 - ' + TYnow.getFullYear()+' ○○○○ CO.,Ltd.' );を入れるのでしょうか?

お礼日時:2017/04/15 16:39

>>他のheader、side、本文が表示されないのではないでしょうか?


そうなるから、loadとloadされる側でのdocument.writeは止めるべきです。

phpでincludeした方が良いと思います。
header部分、side部分、footer部分を作ってファイルにして置き、メインからincludeすれば、こういう問題は起きないケド。

メインが.phpになってしまうけど、.htaccessファイルに記述して.htmlのまま動かせる。

実戦では、この方法しか使ってません。
動的javaは何が起きるか解らないから、設計段階でincludeを念頭に置いてます。
    • good
    • 0
この回答へのお礼

ありがとうございました。
phpはまだやったことがないので、組み込み方がわかりません。
勉強します。

お礼日時:2017/04/16 14:08

ANo1です。



>~~とかがさっぱり意味不明でわかりません。
大変、失礼いたしました。
リンクをここのシステムが自動で変換してくれるのですが、中途半端な変換になってしまっているようです。
以下のアドレスの最初に英数小文字のhを付け加えて下さい。
ttps://www.google.co.jp/search?q=javascript+文書+書き替え&oq=javascript+文書+書き替え&aqs=chrome..69i57.26265j0j4&client=ms-android-kddi-jp&sourceid=chrome-mobile&ie=UTF-8#xxri=2

念のため、最初の方に出てくるサイトも・・
http://hacknote.jp/archives/11502/
http://www.24w.jp/study_contents.php?bid=javascr …
ttp://design-spice.com/2010/07/27/javascriptでhtml中のテキストを変更する/
    • good
    • 0
この回答へのお礼

何度もご回答頂き、ありがとうございました。

お礼日時:2017/04/16 14:10

ANo4です。



jQueryを利用なさっているのでしたね。
動作すれば良いのであれば、footer.htmlの内容を、

Copyright&copy; 2014<span id="copyright"></span> ○○○○ CO.,Ltd.

とでもしておいて、スクリプトの
$("#footer").load("footer.html"); の部分を

$("#footer").load("footer.html", function(){
var d = new Date();
$("#copyright").html(" - " + d.getFullYear());
});

のようにすれば動作すると思います。
(これだと、わざわざloadする意味がほとんどありませんけれど…)

※ idが重複するような場合は、違うものに変えて下さい。
    • good
    • 0
この回答へのお礼

何度もご回答いただき、ありがとうございました。
見事にできました。
本当に、ありがとうございました。

お礼日時:2017/04/16 14:07

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!