芽萌丸プログラミング部
芽萌丸プログラミング部 @programming
プログラミング関連アカウント。Web標準技術を中心に書いていきます。フロントエンドからサーバサイドまで JavaScript だけで済ませたい人たちの集いです。記事は主に @TanakaSoftwareLab が担当。

に関する公開記事

ブラウザからファイル出力(ダウンロード処理)

ピュアなJavaScriptを使ってブラウザからファイルを出力させる方法です。この方法を使えば、JavaScriptによってブラウザ上で生成された任意のデータ(例えばCSVとか)をファイルとしてダウンロードさせることができます。Excelでも文字化けせずに開けるCSVファイルの出力方法も。

Updated by @programming at 2021/5/27
ブラウザからファイル出力(ダウンロード処理)の画像

ブラウザからファイル内容を読み込む

ChromeやFirefox等の Web API だけを使ってローカルファイルのデータを読み込むサンプルコード。

Updated by @programming at 2021/5/27
ブラウザからファイル内容を読み込むの画像

ArrayBufferとTypedArray,Blob等相互変換

ArrayBuffer(最もプリミティブなバイト列)を中心にTypedArray(Uint8Array等)、Blob、Base64、Data URL、Hexと相互変換するコードのご紹介。ブラウザで動作し、外部ライブラリも不要。

Updated by @programming at 2020/7/5
ArrayBufferとTypedArray,Blob等相互変換の画像

ピュアJSでData URIな音データを再生

base64変換されたmp3な音データをピュアなJavaScriptで再生する方法のご紹介。おまけで wavファイルからmp3への変換、base64文字列化の方法も。(要ffmpeg)

Updated by @programming at 2020/5/25
ピュアJSでData URIな音データを再生の画像

ピュアJS: HTMLの該当文字列をmarkタグで囲う方法

外部ライブラリを使わず生JSだけでHTML内の特定の文字列をmarkタグで囲う(マーカーを引く)方法のご紹介。

Updated by @programming at 2020/5/11
ピュアJS: HTMLの該当文字列をmarkタグで囲う方法の画像

ピュアJSで配列からランダムに1件取得するワンライナー

ピュアなJavaScriptで配列から要素をランダムに1件取得するワンライナーです。

Updated by @programming at 2020/4/24
ピュアJSで配列からランダムに1件取得するワンライナーの画像

ピュアJS:ブラウザで任意のカメラデバイスを選択

PCもしくはモバイル端末のブラウザ上で任意のカメラデバイスを選択し、videoタグで利用するサンプルです。ピュアなJavaScriptだけを使って実現しています。

Updated by @programming at 2020/2/3
ピュアJS:ブラウザで任意のカメラデバイスを選択の画像

ピュアJSで画像の遅延読み込み

ピュアなJavaScriptだけを使って画像の遅延読み込み(レイジーロード)を実現する方法のご紹介。ユーザがブラウザのタブをスクロールした時にタブの表示領域に入ってきた画像要素だけを読み込みさせることで、Webページの全体的な表示を軽くします。

Updated by @programming at 2019/12/18
ピュアJSで画像の遅延読み込みの画像

JavaScriptで画像の動的ロード

JavaScriptを使って画像を動的に読み込む方法です。画像の読み込み中のローディングイメージの表示などに応用できます。ピュアJS版とjQuery版の2つをご用意しました。

Updated by @programming at 2019/7/29
JavaScriptで画像の動的ロードの画像

生JSでAsync/Awaitも使わずに非同期関数の同期的ループ

ピュアなJavaScriptだけで且つAsync/Awaitも使わずに非同期関数の同期的ループを実現する方法です。このテクニックはイテレーターとジェネレーターを使います。主に古き良きCallbackスタイルでコーディングされているシステムで使えるテクニックですが、様々な理由でAsync/Awaitを敢えて使いたくない(or 使えない)場面でも使えるかと思います。

Updated by @programming at 2019/6/11
生JSでAsync/Awaitも使わずに非同期関数の同期的ループの画像

Updated by