価格コムのキープ機能を比較表URLに変換

• 2022/05/11のメモです。
• ほぼ日記調です。本編は使い方の項目からです。

価格comのキープ機能は便利だが・・・

• 消えやすく、保存出来ず、送れない。
• ローカルストレージに保存されてる。
  • 別のPCや人に送れない。
  • サーバーに保存されてない。
  • 消える可能性大。
    • PC引っ越しでほぼ消える。
    • プライバシー系の掃除してたらほぼ消える。
• 送りたいし、消えたら悲しいので、なんとかしたい。

他の使えそうな機能

• お気に入り
  • 簡単に登録できる
  • 比較できない
  • ピックアップリストに登録できる
• ピックアップリスト
  • 下書きに簡単に追加できる
  • 下書きは一枚限定
  • 投稿するには、すべての製品にコメント必要？
    • ここで諦めた
• 比較表
  • 検索結果などからチェックして使える。
  • URLなので簡単に送れるし、誰でも見れる。
  • 文字も入れれる。
  • URLの変数もそのままなので、数個ならコピペで編集出来る。
  • https://kakaku.com/prdcompare/prdcompare.aspx?pd_cmpkey=K0001376771_K0001269921_K0001304408 こういうやつ。
  • これしかない。

比較表に変換するスクリプトを作った

• 総合時間ではコピペのほうが圧倒的に早い。

使い方

• 下のコードをコピーして、キープ一覧画面で、開発者ツールのコンソールに貼り付けて実行。
  • ただそういう攻撃もあるらしいので、軽くソースを読んでからのほうがいいらしい。

コード

var main = function() {
  //chromeなら$$、他は[...document.querySelectorAll()]
  let arr1 = $$("tr.lv0top.prdName a").map(v=>v.href)
  //イラン部分消し matchなら(?<=item.).+?(?=\/)
  arr1 = arr1.map(v=>v.replace('https://kakaku.com/item/', "").replace(/\/.*/, ""))
  //重複消し、[...(new Set())]も同じ。
  arr1 = Array.from(new Set(arr1))
  //urlを作る
  let url = 'https://kakaku.com/prdcompare/prdcompare.aspx?pd_cmpkey='
  url += arr1.join('_')
  window.open(url, '_blank')
  return url
}
main()

自分用の雑記

• 比較ページで実行したら、比較のURLに追記みたいなのも出来そう。
• 表示部から解析したけど、ローカルストレージからのほうが早いな・・・
• 久しぶりにJS触るからほとんど忘れてる。
  • for文の書き方も忘れたことある。
  • 子供の頃もすぐ忘れた。夏休み明けに、掛け算の筆算のやりかた忘れてた（懐
  • 中期の記憶領域の性能に問題がある。
• 価格コム、価格com、価格.com
  • どれで書くべきか迷う
• なんか数増えてる。カラーバリエーションのhrefも拾ってきてしまってる。
  • urlフィルタリングが汎用性から好きだけど、これは無理。
  • 要素でフィルタリングに変更
  • xpathでtext()=製品名でやってみた。毎回xpath忘れすぎ。
  • 普通に開発者ツールからセレクタコピーから削ったら良いかとcssセレクタに戻す。
  • Qiitaの差分を試してみる。コピーボタンは全部コピーされた。
• xpathの解説
  • /最初のスラッシュだけはdocumentになる。//adocumentの 子孫のa
  • $x('//tr//*[text()="製品名"]/ancestor::tr//a')
  • ↑docの 子孫のtrの 子孫のなんでも(テキストが製品名)の 先祖のtrの 子孫の a
  • 最初の//tr は無くても良いが、テーブルなんで一応。
  • 覚書
    • 子供a⇔/child::a⇔ /a
    • //self::a/self::a/self::a/ セルフならこんなことも出来る。
    • 親* ⇔/parent::* ⇔ /..
• cssセレクタ覚書
  • 孫 ⇔ html>body>div ⇔ html div
• xpathとcssセレクタのクロスのチートシート欲しい。
• 記憶復活にチートシートはすごい重要と再認識
  • 別言語で同じ意味の相互表は、学習コストめっちゃ下がりそう

+ let arr1 = $$("tr.lv0top.prdName a").map(v=>v.href)
- let arr1 = $$('a[href^="https://kakaku.com/item/"]').map(v=>v.href)
- let arr1 = $x('//tr//*[text()="製品名"]/ancestor::tr//a').map(v=>v.href)

参考リンク