How do I create a GUID / UUID?Ask questions, find answers and collaborate at work with Stack Overflow for Teams. Explore Teams Collectives™ on Stack Overflow Find centralized, trusted content and collaborate around the technologies you use most. Learn more about Collectives
faviconをアニメーションさせてみる | ジャーナル | トライベック
ブラウザのタブに表示されるfaviconが通知を教えてくれることがあります。赤いマークがついたりして、新着情報があることをfaviconがユーザにメンションしてくれます。なかなか気の利いた心遣いです。 通知が来るとリアルタイムでfaviconが変化し、通知に目を通すとその場で元に戻るので、表示するfaviconを動的に切り替えていることがわかります。 ということは、faviconを一定間隔で次々に切り替えていけばパラパラ漫画のようにアニメーションさせられるかも？ ──という子供のような思いつきを実行に移してみます。 本当にfaviconを変更できるか？ まずは、faviconを簡単に切り替えられるかどうか実験してみます。 faviconを2枚用意して、ボタンを押すと切り替わるだけのjQueryを書きました。 <button><img src="./favicon-a.png"></butt
【JavaScript】オブジェクトからクエリパラメータを生成する方法 - Qiita
const params = new URLSearchParams({ sample: 10, example: 20 }) console.log(params.toString()) // "sample=10&example=20" Register as a new user and use Qiita more conveniently You get articles that match your needsYou can efficiently read back useful informationYou can use dark themeWhat you can do with signing up
JavaScriptのsort関数で日本語を50音順に並べたい - Qiita
目的 JavaScriptで日本語でのソートを行う際、意図した挙動にならなかったため自分なりに調べた結果をまとめました。 今回はこんな感じで単純な文字列をソートしていきます。 const array = ["う", "い", "あ", "ウ", "イ", "ア", "宇", "井", "亜", "a", "i", "u"];
[JavaScript] 数字を3桁カンマ区切りにする、2つの方法 - YoheiM .NET
こんにちは、@yoheiMuneです。 数値を3桁カンマ区切りにしたいという要件を、JavaScriptでどのように実現するのかについて、ブログに書きたいと思います。 目次 解決したいこと 「数字は3桁カンマ区切りで表示したいんだよね〜」と言われた時に、サクッと対応できる方法をお伝えしたいと思います。 方法1：toLocaleString()を利用 実装方法 もっとも簡単に対応するなら、toLocaleString()関数を使うと便利です。数値型の変数に利用できます。 var num = 12345; num.toLocaleString(); // "12,345" toLocaleString()はロケール（=言語、国、地域、などを表現する、例：ja）に合わせた数値表現を行うためのメソッドです。ロケールによって表示が異なりますが、日本語や英語の場合には3桁カンマ区切りとなります。 ブラ
![[JavaScript] 数字を3桁カンマ区切りにする、2つの方法 - YoheiM .NET](https://cdn-ak-scissors.b.st-hatena.com/image/square/59af8a45171618d90e4d4f0d7fe3d06f158278fc/height=288;version=1;width=512/https%3A%2F%2Fwww.yoheim.net%2Fimage%2F624.jpg)
ページを離れる時のメッセージ - onbeforeunload
今回は非常にシンプルですが、非常に重要なイベントについて説明します。 オンラインで何かを入力している最中に、うっかり別のページに移動してしまい、入力していたデータが消えてしまった・・・ というような失敗は、誰しも一度や二度、経験したことがあるのではないでしょうか。 ところが、最近のウェブアプリケーションでは、次のような便利なメッセージを見たことがあるかもしれません。(Firefox の場合) あるいは Internet Explorer では次のようなボタンが表示されます。 入力フォームを表示するページでは、意図せずページを移動するようなタイミングでこうしたメッセージを表示するのは大変ユーザーにとってありがたいものです。 前置きが長くなりましたが、この記事ではこのメッセージの表示方法と抑制方法をしめします。 onbeforeunload ダイアログの表示方法 まず先に、上のダイアログを表示
BOMやBlobを理解してJavaScriptでCSVを出力する - Qiita
BRIGHT VIE Advent Calendar 2018 - Qiita の4日目の記事です。 先日開発を行っている中で、JavaScriptだけでCSVを出力する仕組みを目にすることがあり、 コードの理解も含めて今日はこのことを記載できればと思います。 はじめに 下記のコードを御覧ください。 function exportCSV(records) { let data = records.map((record)=>record.join(',')).join('\r\n'); let bom = new Uint8Array([0xEF, 0xBB, 0xBF]); let blob = new Blob([bom, data], {type: 'text/csv'}); let url = (window.URL || window.webkitURL).createObjec
Puppeteer | Puppeteer
Puppeteer is a Node.js library which provides a high-level API to control Chrome or Firefox over the DevTools Protocol or WebDriver BiDi. Puppeteer runs in the headless (no visible UI) by default but can be configured to run in a visible ("headful") browser. Get started | API | FAQ | Contributing | Troubleshooting Installation npm i puppeteer # Downloads compatible Chrome during installation. np
JavaScriptでBase64エンコード・デコード（UTF-8も） - Qiita
様々なところで使われているエンコード方式です。バイナリデータから64進数にエンコードします。URLエンコードよりもデータ効率がいいらしい。 エンコード前 URLエンコード Base64エンコード
WEBサイトでカメラ(WebCam)映像からQRコードを読むスキャナー
PHPサンプルコード MariaDB(Mysql)サンプル Webで3Dコンテンツ Q&A集 Delphi 初めてのAndroid Studio 初めてのFlutter+Dart プロフィール サイトマップ ホーム Javascript,CSS,HTMLデザイン無料素材集 WEBサイトでカメラ(WebCam)映像からQRコードを読むスキャナー Javascriptでカメラ映像からjsQRを使用してQRコード読む(QRコードをスキャンする) Chrome,Android Chrome,iPhone(Safari)に対応 カメラ使用を許可してください。しばらくすると、カメラ映像が表示されます 多少離れてもいいのでピントを合わせて、QRコードをカメラ映像の赤枠内にあわせると読み取ります 使用したライブラリとソースコード https://github.com/cozmo/jsQR から右上の「Co
JavaScript難読化ツールの紹介と比較 - 備忘録
Ⅰ. はじめに Ⅱ. 比較（無料版） 1. JavaScript obfuscator 2. </> Javascript Obfuscator 3. jjencode 4. Closure Compiler 5. /packer/ 6. YUI Compressor 7. aaencode 8. emojify-webpack-plugin 9. JSFuck 複号ツール JavaScriptbeautifier JStillery REstringer relative/synchrony 有料版一覧 おまけ SourceMapがある場合に利用できる復元ツール Ⅰ. はじめに タイトルの通り「JavaScript難読化ツールの紹介と比較」です。 強力な難読化ツールは基本的に有料です。 ※2017/07/28 追記 こだわる人用 ChromeやFireFoxの開発者ツールのブレークポイン
複数タブに対応していないシステムを、複数タブ禁止にする方法 - grep Tips *
複数タブに対応していないシステムを、JavaScriptを使って複数タブ禁止にする方法。 ※IEの新規セッションから開いた場合はOK HTML5のWebStorageを使う。 【動作タイミング】画面load直後、一定周期（250msec位） 【動作内容】タブ単位でタブを閉じるまで記憶してくれるsessionStorageにタブIDを記憶させ、ブラウザ全体で記憶してくれるlocalStorageのタブIDと比較して、有効なタブかどうかを判定する。セッションと画面表示内容を一致させるため、タブの有効性は後勝にする。 // ID発番フラグ var issuedAlready = false; function forbidMultiTab() { var TAB_ID = "tabID"; var sesTabID = sessionStorage.getItem(TAB_ID); var lc
ローカル ストレージ (Local Storage) を使用する - JavaScript プログラミング
目次1 概要2 値を保存する2.1 書式2.2 記述例3 値を取得する3.1 書式3.2 記述例4 値を削除する4.1 書式4.2 記述例5 値をすべて削除する5.1 書式5.2 記述例6 ローカルストレージに保存されている値の数を取得する6.1 書式6.2 記述例7 指定した位置のキーを取得する7.1 書式7.2 記述例8 プログラム例8.1 コード8.2 実行結果 概要 HTML5に対応したブラウザでは、ローカルストレージ(Local Storege)と呼ばれるブラウザのストレージ機能が利用できます。 ローカルストレージは、Keyに対応付けるValueデータを保存できる Key-Value型のストレージです。Cookieよりも大容量のデータを保存できます。(Cookieの容量上限は約4Kbyte) 値を保存する 書式
aタグの効果を残したままリンクを無効にする方法｜freela
<a>タグでリンク要素を複数作ったけど、まだ一部リンク先がない。 <a>タグに付けている効果は無くしたくない 今回は、そのような場合に、ホバー効果も残しつつ、クリックさせてもどこにも移動もさせない<a>タグを残したまま『リンクを無効』する方法をご紹介します。 aタグを使用したリンクの無効化 <a>タグを使用したままリンクだけを無効にしたい場合があるかと思います。 よくある方法では、リンク先を下記のように「#」や「/」にする方法があります HTML <a href="#">○○</a> <a href="/">○○</a> しかし、上記の方法だとクリックされるとページトップ（上部）に戻ってしまうので、この方法もしたくない… 「かといってホバー効果も無くしたくないし<a>タグを<span>にしたり書き直すのもまたCSSに書き足さないと…いま無効にしたいだけなの！！」 のような方もいるかと思いま
ファイルをダウンロードさせるには？［JavaScript］
リンクをクリックするだけでファイルをダウンロードできるようにするには、HTML5のdownload属性を使う方法とJavaScriptコードを使う方法がある。 連載目次 Webページで、エンドユーザーにファイルをダウンロードさせたいことがある。ZIPファイルなどはHTMLでリンクを記述すればよいのだが、テキストファイルやPDFファイルなどのリンクはダウンロードされずにWebブラウザで開いてしまう。何とかならないだろうか？ 本稿ではJavaScriptでファイルをダウンロードさせる方法を解説する。 HTML5のdownload属性 JavaScriptを書き始める前に、HTML5での解決策を紹介しておこう。 リンク（HTMLの<a>要素）には、HTML5でdownload属性が追加された。この属性に対応しているブラウザであれば、テキストファイルやPDFファイルなどでもリンクのクリックでファイ
ファイルをダウンロード保存する方法 - JavaScript 入門
a タグの download 属性でダウンロード 従来は Content-Disposition で「ファイルに保存」としていた これまで、サーバーからのデータを「ダウンロードしてファイルに保存」するには、サーバーからクライアントへの HTTP レスポンスを送信するときに次のような HTTP ヘッダーを送る必要がありました。 Content-Disposition: attachment; filename="foo.png" ブラウザ側では、Content-Disposition というヘッダーをみることで、そのコンテンツをそのままインラインで表示するのではないということを知ることができます。 言い換えると、Content-Disposition というヘッダーがある場合に、ブラウザはそのページにナビゲートするのではなく、これからサーバーから送られてくるデータは今のページのアタッチメント
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Vue.js: 戻る（ブラウザバック）をハンドリングしてメソッドを呼び出す
How can I remove a JavaScript event listener?
Vite | 次世代フロントエンドツール
Simple Drag-and-Drop File Upload In JS HTML (Free Download)