2ページ目以降の画像が読み込まれない場合がある

[arigayas]

例：　「東洋経済オンライン」の2ページ目以降の画像は読み込まれないです。 https://toyokeizai.net/articles/-/362124

例：　「東洋経済オンライン」の2ページ目以降で読み込まれない画像のimgタグ： <img alt="" src="https://tk.ismcdn.jp/common/images/v4/spacer.png" oncontextmenu="return false;" onmouseup="return false;" onmousedown="return false;" data-src="https://tk.ismcdn.jp/mwimgs/9/5/640/img_95f7cc0bf37fa68fb0ae003130250326657280.jpg" class="lozad" width="320">

data-src="" が使われているからでしょうか？

[arigayas]

使用環境

• Firefox 68.12.0esr / Firefox Developer Edition 81.0b1
• weAutoPagerize 1.7.6

[arigayas]

【ニコニコ動画】ニコる(β版)アップデートに対するみんなの反応 - Togetter https://togetter.com/li/1585261

Togetter の場合は data-lazy-type="image" data-lazy-src="" でした。

[knoajp]

どこに挿入すべきかじっくり調べてませんが、とりあえず役に立ちそうなコードを書いてみました。 Togetterの公式の挙動では、ツイアカのアイコン変更などで Not Found になった場合にデフォルトアイコンに置き換えてくれたりもするようですが、そのへんの処理はさすがにスルーでいいでしょう。

(function(){
  const d = document; //実際には関数の引数としてpageElementを受け取るだろう
  const DATASETS = [ //たぶんほかにも色々あるとは思うけど
    'src',
    'lazySrc',
  ];
  const imgs = d.querySelectorAll('img'); //getElementsByTagNameがよければお好みで
  let name = undefined; //そのページで使われているlazyloadプロパティ名
  imgs.forEach(img => {
    if(name === undefined){
      name = DATASETS.find(n => img.dataset[n]);
      if(name === undefined) return;
    }
    if(img.dataset[name] !== undefined){
      img.src = img.dataset[name];
    }
  });
  //return d; //必要なら
})();

[knoajp]

少し整えて、ユーザースクリプトの形で公開しました。 https://greasyfork.org/ja/scripts/416710-autopagerize-lazy-load-assistant

[arigayas]

@knoajp さん ユーザースクリプトを作成していただきありがとうございます。