JavaScriptJavaScriptにおける「?（クエスチョン/はてな）」の意味と使い方
以前、『JavaScriptにおける「$（ドルマーク）」の意味と使い方』で、ドルマークの利用シーンについてまとめましたが、本ページでは「?」はてなマーク（クエスチョンマーク）についてJavaScript内でどのように使われるのかシーン別でま...
JavaScript
JavaScript
JavaScriptブラウザの更新ボタンクリックを検知する方法【JavaScript】
ブラウザの更新ボタンがクリックされた時には、通常はページのリロードが行われますが、その際に特定の処理を行いたい場合があります。例えば、変更が保存されていない場合に確認メッセージを表示したり、特定のデータをサーバーに送信したり等々。 更新ボタ...
JavaScriptDOM（要素）の変更や更新を検知するベストな方法〜MutationObserver APIの使い方【JavaScriptガイド】
最近、仕事でDOMが変更されたときにコードを発火したい場面が多く、クリック時やajaxで内容の更新などのタイミングでその都度似たようなメソッドを仕込むのが面倒になることがありました。特に大量のiframeを扱う必要があったので、1ヶ所１ヶ所...
JavaScriptインターバルタイマー Webブラウザ版【PC/スマホ/タブレット対応・3つ利用可・無料】
無料Webブラウザ版インターバルタイマーです。クイック起動ボタンがあり、素早く起動できます。設定の保存も可能です。全画面表示対応なので特にiPadでの利用がおすすめです。
JavaScripthtml2canvasをスマートフォン（iPhone iOS Safari, Android Chromeのレスポンシブページ）に対応させる方法【JavaScript】
先日、『【PNG画像出力&エクセル出力対応】チーム分けWebツール・重複なしで均等に【グループ分けや組み分けを行うランダム生成オススメWebアプリ】』と『【簡易画像キャプチャ機能付き】テキストを比較して差分を表示するdiffツール【Java...
JavaScript【簡易画像キャプチャ機能付き】テキストを比較して差分を表示するdiffツール【JavaScriptでWebツール】
#text-container { display: flex; justify-content: space-between; } #text-container span { background-color: #ccc; } .inp...
業務効率化【色変更・プレビュー機能付き】SVGタグをBase64変換してCSSのbackground-imageプロパティ用に変換するツール【Photoshop,Illustrator】
SVGタグを入力: 変換 CSS background-image: SVGプレビュー: 色を選択: ※fill値が無いなど色変更できない場合もあります※色を選択するとbackground-imageプロパティのコードも変わります #con...
業務効率化チーム分けWebツール～グループ分けや組み分けをランダム生成！
もちろん無料のチーム分けツールです！Webで完結します。使いやすさを追求した便利機能付き！人数カウンターやグループハイライトなど
JavaScript画面に要素が入ったかを監視したい～Intersection Observer APIの使い方【JavaScript】
以前、IEが消滅してフロントエンドエンジニア的にメリットを強く感じる旨の記事を掲載しました。『IE（InternetExplorer）のサポート終了から生まれるメリット5選！～フロントエンドエンジニアの観点からJavaScriptを考える』...
業務効率化Web制作でFlutterやReactのようなホットリロード（もどき？）を実現してコーディング効率を爆上がりさせる方法
Webのコーディングはファイルを編集して、ファイルをアップロードして、ブラウザを更新して初めて修正箇所が分かるのですが、これが非常にめんどくさい。 ファイルを編集&保存（F5押下不要）、でブラウザの表示が変わったら劇的に作業効率爆上がりませ...
JavaScriptCDN Vue.js 3系でVCalendarを動作させられないので諦めた話
const { createApp } = Vue createApp({ data() { return { selectedDate: null, } } }).mount('#app') 公式サイトが完全に正しいと鵜呑みにしないように...
JavaScript【初心者向け】JavaScriptでモーダルウィンドウの作成方法と注意事項、サンプルコード
JavaScriptで書ける基本中の基本のギミックにモーダルウィンドウという効果があります。画像をクリックすると全画面で黒背景に大きな画像が表示され、視認性をよくするためのあれです。 HTMLコーダーにはモーダル、と聞くとアレルギー反応を起...
JavaScript初心者も押さえておくべきWebセキュリティ vol.2 『クロスサイトリクエストフォージェリ（CSRF）』からの保護対策
クロスサイトリクエストフォージェリ（以下、CSRF）は、Webセキュリティの重要な脅威の一つです。攻撃者は、被害者のアカウントを悪用し、不正なリクエストを送信することで、ユーザーの意図しないアクションを実行させることができます。この記事では...
JavaScript初心者も押さえておくべきWebセキュリティ vol.1 JavaScript『クロスサイトスクリプティング（XSS）』 効果的な対策方法と最適な方法
Webアプリケーションのセキュリティは、ユーザーのデータ保護と信頼性の確保にとって不可欠ですね。特に、クロスサイトスクリプティング（以下、XSS）攻撃は、JavaScriptを使用して悪意のあるコードを注入し、ユーザーのブラウザ上で実行する...
業務効率化【インストール不要】サブディスプレイ・モニタにスクリーンセーバーエフェクトを動作させるブラウザアプリ【JavaScript ブラウザアプリ】
先日、使っているノートPCが小さいなぁと感じ、モバイルディスプレイをAmazonのタイムセールで買いました（なんとドイツ製っぽいんですが12,800円也）。 そろそろ使い慣れてきたのですが、ふとサブモニタにスクリーンセーバー欲しいな、って画...