File System Access API にはファイルを開く showOpenFilePicker() メソッド、ファイル保存ダイアログを表示する showSaveFilePicker() メソッ...
Continue reading...JavaScript
【JavaScript】File System Access API – ファイルピッカーを表示してファイルを保存する方法 showSaveFilePicker() 編
ファイル保存ダイアログを表示し、ユーザーに PC やスマートフォン内にファイルを保存するには 2 つの方法あがります。今回は旧来より使われてきた <a download=”filename”> ...
Continue reading...【JavaScript】File System Access API – 仮想的なファイルシステム Origin Private File System 編
JavaScript で扱えるストレージといえば Web Storage や Indexed Database API がありますが、ファイルやディレクトリという概念を使ってデータを保存したい場合もあ...
Continue reading...【HTML】徹底解説 dialog 要素 – マークアップからスタイリング、JavaScript による操作まで
[2022-07-28 更新] dialog 要素はかなり以前より HTML5 仕様に存在していましたが、Safari がサポートしていなかったことでなかなか現場で使われませんでした。しかし、2022...
Continue reading...【JavaScript】File System Access API – ファイルピッカーを表示して選択ファイルを読み取る方法 showOpenFilePicker() 編
ファイルピッカーを表示し、ユーザーに PC やスマートフォン内のファイルを選択させ、選択されたファイルの中身を読み取るには 2 つの方法があります。今回は、旧来から使われてきた <input t...
Continue reading...【JavaScript】DOM の変化を監視する MutationObserver
ウェブサイトやウェブアプリを開発する際に、自身が書いた JavaScript で HTML ドキュメントの DOM ツリーの操作を行うこともあれば、読み込んだ JavaScript ライブラリーが D...
Continue reading...【JavaScript】HTML 要素の寸法の取得方法まとめ
JavaScript から HTML 要素の横幅と高さを取得する方法はいくつか存在します。しかし、それぞれの方法で取得する寸法が微妙に違います。今回は HTML 要素の寸法を取得する方法を一気にまとめ...
Continue reading...【JavaScript】HTML 要素のリサイズを検知する Resize Observer
ウェブブラウザーのウィンドウをリサイズするなどして、コンテンツのサイズが変わることがあります。そのリサイズに合わせて何かを実行したいというニーズは多いのではないでしょうか。今回は、そのニーズに応える ...
Continue reading...【JavaScript】配列のすべての値をまとめて評価、Array.every() と Array.some()
配列の値すべてが条件を満たしているか、配列の値のいずれか 1 つでも条件を満たしているか、といった処理はときどき遭遇します。しかし、頻繁に遭遇しないせいか、すぐに忘れてしまうのが Array.ever...
Continue reading...【JavaScript】オブジェクトのプロパティの存在をチェックする 4 つの方法と特性の違い
オブジェクトの中に特定のプロパティが存在するかをチェックする方法はいくつかあります。しかし、どの方法を使うか迷うことはないでしょうか。今回はそれらの方法を一通り整理し、それぞれの特性についてまとめて...
Continue reading...