web-dev-qa-db-ja.com

HTMLWebページに動的な日付を挿入するにはどうすればよいですか

静的なWebページがあり、動的に変更されるものはありません。ただし、クライアントはページ内のテキストに日付を挿入することを望んでいます。日付は常に現在のdaetに1日を加えたものになります。それ、どうやったら出来るの？

javascripthtmldatetextstatic
6
mattgcon

JavaScriptを使用して、日付onLoadを挿入します。

実用的な例については、こちらをご覧ください： http://jsfiddle.net/xGDvp/

これにより、日付が次のように更新されます：2011年2月5日

あなたのHTML：

<span id="spanDate"></span>

あなたのJavascript

    <script type="text/javascript">
           var months = ['January','February','March','April','May','June','July',
'August','September','October','November','December'];       
var tomorrow = new Date();
tomorrow.setTime(tomorrow.getTime() + (1000*3600*24));       
document.getElementById("spanDate").innerHTML = months[tomorrow.getMonth()] + " " + tomorrow.getDate()+ ", " + tomorrow.getFullYear();
    </script>
4
NakedBrunch

Downvoters：タグ「javascript」が追加されたことに注意してくださいafterこの回答が与えられました。

サーバーがサポートしている場合は、サーバーサイドインクルード（SSI）を使用できます。

サーバーがApacheの場合、たとえば、次の要素をHTMLページに配置して、現在の日付+ 1日を出力できます。

_<pre>
<!--#exec cmd="date -v +1d '+DATE: %Y-%m-%d'" -->
</pre>
_

今日が2011-02-05であるとすると、ブラウザのページに次の出力が表示されます。

_...
DATE: 2011-02-06
...
_

完全な平日の名前を出力するには、_date -v +1d '+DATE: %A %d, %Y'_を使用できます。これにより、_DATE: Sunday 06, 2011_が得られます。

参考文献：

3
Yasir Arsanukaev
window.onload = initDate;
function initDate() {
     var dayName = new Array("Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday","Saturday");
     var monName = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
     var now = new Date();
     var dtString = dayName[now.getDay()] + ", " + monName[now.getMonth()] + " " + now.getDate();
     document.getElementById("dtField"). innerHTML = dtString;
}

ソース

2
user1480922

PHPに反対しない場合は、次のようなことを行うことができます... Tizag .. http://www.tizag.com/phpT/phpdate.php

<?php
$todayPlusADay = mktime(0, 0, 0, date("m"), date("d")+1, date("y"));
echo "Todays Date Plus One Day (Tomorrow) ".date("m/d/y", $todayPlusADay); 
?>

「phpechodate + 1 day」をすばやく検索すると、その小さなディディが生成されました:)それは確かにほぼある程度まで拡張できます。

1
rhaag71

Javascriptを使用して、ページのどこかに日付を挿入できます。

<script type="text/javascript">
var newDate = new Date();
newDate.setDate(newDate.getDate() + 1);

//insert it via jquery
$('#displayDate').html((newDate.getMonth() + 1) + '/' + newDate.getDate() + '/' + newDate.getFullYear());

//or insert it via javascript
document.getElementById('displayDate').innerHTML = (newDate.getMonth() + 1) + '/' + newDate.getDate() + '/' + newDate.getFullYear();

</script>

およびhtml：

<span id="displayDate"></span>

ここでテストしてください： http://jsfiddle.net/9xWUT/

1
Victor

多くのタイピングを節約できるので、XDateをお勧めします。また、innerHTMLは使用しないでください。これは悪い習慣です。私はWebページで同じことをしました。重要なことは、更新するタグの下にインラインJavaScriptを使用することでしたが、「onload」も使用できます。

このページにタグを追加し、次の理由だけでデフォルト情報を入力します。

<p>Today is <span id="todays_date" style="font-style: italic;">November 1, 2015</span></p>

その下にこれで：

<script type="text/javascript">
  var today = new XDate();

  document.getElementById("todays_date").innerHTML = "";

  document.getElementById("todays_date").appendChild(document.createTextNode(today.toString("MMMM d, yyyy")));
</script>

注意：これは別のライブラリにあり、この例には関係ないため、再帰的な「すべての子を削除」するのではなく、innerHTMLを使用してネストされたタグをすばやく消去します。

http://arshaw.com/xdate/ を参照してください

1
Richard Nunes

あなたは私の方法でそれを行うことができますこれは以下です

HTML：

<asp：Label ID = "Label1" runat = "server" Text = ''>

JavaScript：

<script language="javascript" type="text/javascript">
function date_time() {
    var dt = new Date();
    document.getElementById('<%=Label1.ClientID%>').innerHTML = dt;
    setTimeout(function () { date_time(); }, 1000);
}
date_time();
0
Muhammad Hamayoon

あなたはjavascriptでそれを行うことができます。 http://www.tizag.com/javascriptT/javascriptdate.php

次に、たとえばテキストにスパンタグを追加し、JavaScriptを使用して日付を挿入できます。 jQueryを使用できる場合は、次のようなことができます。

html：

<p>Tomorrow: <span class="tomorrow"></span></p>

javascript：

$(function() {
    var date = new Date()
    $(".tomorrow").html(date.getDate() + 1) // you'll have to search how to format the date
});
0
Robin