frontend-engineer.net Open in urlscan Pro
183.90.237.84  Public Scan

Form analysis
3 forms found in the DOM

POST https://frontend-engineer.net/wp-comments-post.php

<form action="https://frontend-engineer.net/wp-comments-post.php" method="post" id="commentform" class="comment-form" novalidate="">
  <p class="comment-notes"><span id="email-notes">メールアドレスが公開されることはありません。</span> <span class="required-field-message"><span class="required">※</span> が付いている欄は必須項目です</span></p>
  <p class="comment-form-comment"><label for="comment">コメント <span class="required">※</span></label><textarea id="comment" name="comment" cols="45" rows="8" maxlength="65525" required=""></textarea></p>
  <p class="comment-form-author"><label for="author">名前 <span class="required">※</span></label> <input id="author" name="author" type="text" value="" size="30" maxlength="245" autocomplete="name" required=""></p>
  <p class="comment-form-email"><label for="email">メール <span class="required">※</span></label> <input id="email" name="email" type="email" value="" size="30" maxlength="100" aria-describedby="email-notes" autocomplete="email" required=""></p>
  <p class="comment-form-url"><label for="url">サイト</label> <input id="url" name="url" type="url" value="" size="30" maxlength="200" autocomplete="url"></p>
  <p class="comment-form-cookies-consent"><input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes"> <label for="wp-comment-cookies-consent">次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。</label></p>
  <p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="コメントを送信"> <input type="hidden" name="comment_post_ID" value="268" id="comment_post_ID"> <input type="hidden" name="comment_parent" id="comment_parent"
      value="0"> <span class="screen-reader-text">Post comment</span></p>
  <p style="display: none;"><input type="hidden" id="akismet_comment_nonce" name="akismet_comment_nonce" value="ecc7f8c51c"></p><textarea name="ak_hp_textarea" cols="45" rows="8" maxlength="100" style="display: none !important;"></textarea><input
    type="hidden" id="ak_js" name="ak_js" value="1702834072167">
</form>

<form autocomplete="off" aria-label="Ajax search form"> <input aria-label="Search input" type="search" class="orig" name="phrase" placeholder="Search here.." value="" autocomplete="off"> <input aria-label="Autocomplete input, do not use this"
    type="text" class="autocomplete" name="phrase" value="" autocomplete="off"> <input type="submit" value="Start search" style="width:0; height: 0; visibility: hidden;"></form>

Name: options —

<form name="options" autocomplete="off">
  <div class="asl_option_inner hiddend"> <input type="hidden" name="qtranslate_lang" id="qtranslate_lang1" value="0"></div>
  <fieldset class="asl_sett_scroll">
    <legend style="display: none;">Generic selectors</legend>
    <div class="asl_option">
      <div class="asl_option_inner"> <input type="checkbox" value="exact" id="set_exactonly1" title="Exact matches only" name="asl_gen[]"> <label for="set_exactonly1">Exact matches only</label></div>
      <div class="asl_option_label"> Exact matches only</div>
    </div>
    <div class="asl_option">
      <div class="asl_option_inner"> <input type="checkbox" value="title" id="set_intitle1" title="Search in title" name="asl_gen[]" checked="checked"> <label for="set_intitle1">Search in title</label></div>
      <div class="asl_option_label"> Search in title</div>
    </div>
    <div class="asl_option asl-o-last">
      <div class="asl_option_inner"> <input type="checkbox" value="content" id="set_incontent1" title="Search in content" name="asl_gen[]" checked="checked"> <label for="set_incontent1">Search in content</label></div>
      <div class="asl_option_label"> Search in content</div>
    </div>
    <div class="asl_option_inner hiddend"> <input type="checkbox" value="excerpt" id="set_inexcerpt1" title="Search in excerpt" name="asl_gen[]" checked="checked"> <label for="set_inexcerpt1">Search in excerpt</label></div>
  </fieldset>
  <fieldset class="asl_sett_scroll">
    <div class="asl_option_inner hiddend"> <input type="checkbox" value="post" id="1customset_11" title="Hidden option, ignore please" name="customset[]" checked="checked"> <label for="1customset_11">Hidden</label></div>
    <div class="asl_option_label hiddend"></div>
    <div class="asl_option_inner hiddend"> <input type="checkbox" value="page" id="1customset_12" title="Hidden option, ignore please" name="customset[]" checked="checked"> <label for="1customset_12">Hidden</label></div>
    <div class="asl_option_label hiddend"></div>
  </fieldset>
</form>

Text Content

Skip to content

Search Toggle
Home  >  JavaScript


JAVASCRIPTで月日を２桁表示にする方法

Published date 2021年2月6日

Last modified date 2021年5月29日

Author 魔王様


JSで月日を2桁（ゼロ付き）表示するためには

今回はjsで0付きの日付にしたい場合のスニペットを紹介するぞ。


月日の前に必ず0をつけるようにするには

月日の取得方法

月の場合は、getMonth()で取得し、日付の場合はgetDate()で取得する。そして、取得した日付の前に0をつけるようにする。これで、必ず0がつくようになるぞ。

ちなみにgetMonth()の後ろに＋１がついているのはgetMonth()の返り値が0-11なので１追加することで当月と合わせている。

//現在の日付を取得
var days = new Date();
//月
var month = ("0"+(days.getMonth() + 1)).slice(-2);
//日
var date =  ("0"+days.getDate()).slice(-2);

ゼロをつけた後、日付の文字数をSLICEメソッドで調整する

さて、0がつくようにしたが、1桁でも2桁でも必ず0がつくようになったので、このままだと12月31日が012月031日になってしまう。

その調整をするためにsliceメソッドを使うのだ。



//現在の日付を取得
var days = new Date();
//月　後ろから２桁の文字取得することで、1月は01、12月は12月になるようする。
var month = ("0"+(days.getMonth() + 1)).slice(-2);
//日　後ろから２桁の文字取得することで、1日は01、31日は31になるようする。
var date =  ("0"+days.getDate()).slice(-2);


SLICEメソッドとは

日付を整えるために使用したsliceメソッドについても簡単に説明しておいてやろう。

sliceメソッドは文字列から指定した文字部分を取得するものだ。

let mahou = 'フィンガーフレアボムズ';
let sub;

sub = mahou.slice(5,8);
console.log(sub);
//フレア

sub = mahou.slice(5);
console.log(sub);
//フレアボムズ

sub = mahou.slice(-3);
console.log(sub);
//ボムズ

SLICEメソッドの使い方

sliceはslice(開始部分, 終了部分)で使用する。開始部分、終了部分には数字を入れるのだ。

slice(3)のように1つだけ入れると、開始部分を入れたことになる。その場合は開始位置から終わりまで指定したことになる。

slice(-3)のように負の数字を入れると、文字列の後ろから指定をすることになる。

今回のゼロ付きの日付の取得の場合は、後ろから2桁を指定すれば0付きか2桁の月日を指定できるので、slice(-2)となっているのだ。


JSで月日を2桁（ゼロ付き）表示する方法のまとめ

注意すること
・getMonth()の返り値は－1になっている。
・sliceメソッドで桁を調整する。

以上がゼロ付きの月日の表示方法だぞ！

//現在の日付を取得
var days = new Date();
//月　後ろから２桁の文字取得することで、1月は01、12月は12月になるようする。
var month = ("0"+(days.getMonth() + 1)).slice(-2);
//日　後ろから２桁の文字取得することで、1日は01、31日は31になるようする。
var date =  ("0"+days.getDate()).slice(-2);

Categories:JavaScript

Tags:getMonth()slice()日付

魔王様






コメントを残す コメントをキャンセル

メールアドレスが公開されることはありません。 ※ が付いている欄は必須項目です

コメント ※

名前 ※

メール ※

サイト

次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。

Post comment



 * Prev Post
   
   レスポンシブデザインに使用する@mediaの設定

 * Next Post
   
   hoverした時に中心からアンダーラインを出すcssアニメーション

©2023 魔王様、フロントエンドエンジニアを目指す / プライバシーポリシー



Back To Top

Close

Generic selectors
Exact matches only
Exact matches only
Search in title
Search in title
Search in content
Search in content
Search in excerpt
Hidden

Hidden