JavaScript

【JavaScript】フォームの要素を取得する際、要素名に変数を設定する

関数化したい場合などでname属性の部分に変数を設定したいときは.（ドット）を無くし[]の中に変数を設定することで要素を取得することができます。

【JavaScript/PHP】生年月日から年齢を計算する

現在の日付から生年月日を引いて、1万で割ると年齢を計算することができます。それぞれ、19900401の部分に生年月日を設定します。

【JavaScript】任意の位置にHTML要素を挿入する

ページの指定した位置にHTML要素を挿入するときは、appendChild、before、after、insertBeforeの4種類のメソッドで挿入することができます。

【JavaScript】HTML要素を複製（コピー）する

複製したいHTML要素に対してcloneNodeメソッドを使うことで、属性やテキストを保持したままHTML要素を複製することができます。cloneNodeメソッドの戻り値は複製したHTML要素のオブジェクトです。変数に格納することで属性等を編集したり、任意の場所に挿入することで複製したHTMLを表示することが来ます。

【JavaScript / jQuery】ページ読み込み後に実行する関数の違い

JavaScript window.onload = function() window.onload = function() { 実行させたい処理; } HTMLや画像など他の全てのデータの読み込みが完了した時に実行される。複数ある場合...

【CSSのみ】details要素とsummary要素でアコーディオンを作る

よくある質問ページやQ&A等の詳細でよく使うアコーディオンを実装する際、JavaScript（jQueryを含む）をはじめ色々な実装方法がありますが、今回はdetails要素とsummary要素を使用してCSSのみで作る方法をご紹介します。

【CSS/JavaScript】iOS（iPhone）でモーダルウインドウの背面をスクロール禁止にする

モーダルウインドウなど全画面表示かつ背面を固定したい場合、PCだとbodyにoverflow:hidden;を指定することでスクロールしないようにすることができますが、iPhoneで確認するとスクロールができてしまっています。なので別の方法で固定します。

JavaScriptで数値をゼロ埋め（ゼロパディング）する

書式の桁数に満たない数値の場合、足りない桁数だけ0を追加してゼロ埋め（ゼロパディング）することで桁数を合わせます。例えば、3桁で1を表す場合は足りない2桁をゼロで埋めて001と表記します。

【非jQuery】slideToggle/slideUp/slideDownをJavaScriptで実装する

jQueryのslideToggle(),slideUp(),slideDown()的な動きをJavascriptに置き換えます。

1 2