PPP's Blog

雑コード帳

input[type="text"]を走査して、値があるものだけコピーする

やりたいこと

入力欄の値を全部取得・コピーしたい。

やったこと・説明

Chromeの開発者ツールにて、次のコードを実行。

$$('input[type="text"]').filter(e => e.value).map(l => l.value).join('\n')
copy($_)
  • filterはコールバック関数がTrueを返す値で配列を生成し、その配列を返す
  • mapはコールバック関数が返した値で配列を生成・その配列を返す

参考:
Array.prototype.filter() - JavaScript | MDN
Array.prototype.map() - JavaScript | MDN

なので、順番としては

  1. filterで、値が入ったinput[type='text']を抽出・配列に格納
  2. mapで、valueのみ抽出した配列に変換
  3. joinで、配列の中身を改行区切りで取り出す
  4. copy($_)で、3で出力した結果をクリップボードにコピーする

Chromeの開発者ツール(console)では、$_は直前の実行結果を返す。 https://developer.chrome.com/docs/devtools/console/utilities/#recent