javascript

javascript

jQueryで1回だけ実行するイベントを設置する方法

jQueryで1回だけ処理をする場合、便利な「one」メソッドというのがある。「one」メソッドとは、メソッド名のままですが「1度だけ」実行する処理のことを言います。処理を繰り返したくない時などに有効です。一度しか押せないボタンの作り方実際...
javascript

【jQuery】要素があるかを判定する方法

jQueryで特定要素が有るか調べる方法のご紹介です。jQueryif($("特定要素").length) {// 特定要素が有る時} else {// 特定要素が無い時}解説「$("特定要素").length」で特定要素が1つ以上存在した...
javascript

【jQuery】特定の要素が表示されていたらを判定

jQueryで表示・非表示の判定って結構使います。エラーテキストが表示されてたらとか、特定の画像が表示されてたらとか、友達のLINE見たら自分からの通知が非表示になってたりとか判定するところっていっぱいある。では、jQueryのコードを見て...
javascript

【jQuery】パスワードの表示・非表示を切り替える方法

フォームのパスワードを入力する時、自分で打ったパスワードを見たい時ってあるよね。同じパスワードを2回打つフォームもあるし、健忘症な自分は、どんなパスワードを打ったかすぐ忘れちゃうので、表示できる機能があるとありがたいです。ではデモとコードを...
javascript

【jQuery】今日の日付と、今の時間を取得

昔懐かしいウェブサイトには、サイドバーに今の時間とか「〇〇〇人目の訪問者です」とか表示されてましたね。今のサイトでも今日の天気とか取得してたり、今日の日付と時間ってよくみる技術な気がします。そこで、今日は下のdemoに今日の日付と時間をリア...
javascript

【jQuery】HTMLの書き換え方

ボタンを押した時などのユーザーのアクションによってHTMLを書き換える方法のご紹介です。HTML要素内のテキストを書き換える方法テキストだけを書き換える方法です。$(".demo").text("書き換える内容");HTMLタグも書き換える...
javascript

jQueryでn秒後に処理を実行する方法|setTimeout()

jQueryで少し待ってから処理を実行する方法のご紹介です。setTimeout(function() { // 1秒(1000ms)後に処理}, 1000);これで1秒(1000ms)後に処理が実行される。もし「setTimeout()」...
javascript

jQueryでメディアクエリの指定方法|ユーザーエージェントで判定

jQueryでユーザーエージェントからメディアクエリを行う方法のご紹介です。ユーザーエージェントを取得し、表示を切り替えるデモとjQueryです。様々なデバイスやデベロッパーツールで確認してみてください!DEMOこのページをで見ています。j...
javascript

jQueryでメディアクエリの指定方法|画面幅で判定

jQueryで画面幅からメディアクエリを行う方法のご紹介です。画面幅を取得し、横幅によって表示を切り替えるデモとjQueryです。画面を広げたり縮めたりしてみてください!DEMOこれは、表示。width:pxjQuery// 読み込み時とリ...
javascript

jQueryでブラウザの横幅・高さを取得する方法|初回読み込み時、リサイズ時に取得

まずは、ウィンドウの横幅と高さを取得します。DEMO横幅:px高さ:px// ウィンドウの横幅var width = $(window).width();// ウィンドウの高さvar height = $(window).height();...
javascript

jQueryのセレクタ指定方法まとめ|よく使う指定方法から狂気の指定方法まで

jQueryでセレクタ(HTML要素)を指定する方法ですが、ずっとjQueryを使っていても指定方法が難しくって結局いつもクラスを足しちゃったりしているので「覚えよう!」の意味を込めてまとめたいと思います。ID、クラスの指定方法$("#wr...
javascript

jQueryのeachで繰り返し処理を実行する方法|HTML要素と配列で処理を繰り返す

HTMLの数ぶん要素を取得したいときや、配列に格納してある要素ぶん、処理を繰り返したいとき使うのがjQueryの「each()」。「each()」を使った処理の繰り返し方法をデモを使いながら見ていきましょう。HTML上の要素ぶん繰り返すとき...
javascript

【jQuery】文字が1文字ずつ出るアニメーション作成方法

タイトルとか、サイトのキャッチをアニメーションで出す時、一文字ずつフワッフワッと出てくると「おっ!」ってなるじゃない。そんな「おっ!」を聞きたくて一文字ずつ出るテキストを作成してみたいと思います。まずはdemoでどんな感じのアニメか確認して...
javascript

jQueryでURLのパラメーターと値を取得する方法

パラメーターを使って表示を切り分ける方法って、よくphpで利用するよね。それを利用して、URLに特定のパラメーターが付いてる時に、処理する方法をご紹介します。例えばこんなURL「」の時、きっとこのサイトはコロナでの大変なことをまとめているの...
javascript

jQueryでクリップボードにコピーする方法|コピペ

テキストをコピーする時、ユーザーに「Ctrl + c」とか「⌘ + c」とか求めても良いけど「コピーする」ボタンがあったらちょー親切。