沉冰浮水

沉冰浮水

做最终到的事,成为最终成为的人!
github
bilibili
mastodon
zhihu
douban

【メモ】ネイティブJSで未来の要素のイベントを監視する例

最近、コミュニティ化(?)または分散型のマストドン(公式の中国語訳は万象、ネットユーザーはマンモスとも呼ぶ)というマイクロブログシステムを見つけました。簡単に言うと、誰でもそのソースコードを使用してマイクロブログサイトを構築し、ユーザーの登録を許可できます。異なるサイトのユーザーはお互いを見つけたり、フォローしたりすることができます...

↓↓↓

登録 - マストドン中国語サイト

https://acg.mn/invite/DXwRtTMG

マストドン - 検索結果 - 知乎

https://www.zhihu.com/search?type=content&q=Mastodon

↑↑↑

実際には、マストドンに関する説明はこれだけです。詳細は自分で登録して確認してください...

問題は、いくつかの更新されたペーパーマンのボットをフォローした後、NSFW が非常に迷惑だということです。しかし、既にスクリプトが用意されています:

↓↓↓

マストドン NSFW リムーバー

https://greasyfork.org/zh-CN/scripts/29228-mastodon-nsfw-remover

↑↑↑

しかし、画像をクリックすると大きな画像が遅いです... 以下のコードを書いて、マウスが画像上にあるときに自動的に大きな画像に置き換えるようにしました(効果と効果が異なるように感じますが、一旦公開してから調整します)

// ネイティブJSで未来の要素のイベントリスナーを取得する方法 - 笑場 - CSDNブログ
// https://blog.csdn.net/xianglikai1/article/details/76100177

// JSで要素の属性とカスタム属性を取得する方法 - マユウチン - CSDNブログ
// https://blog.csdn.net/qq_24147051/article/details/77976844
(function () {
  "use strict";
  function $n(e) {
    return document.querySelector(e);
  }
  function $na(e) {
    return document.querySelectorAll(e);
  }
  // 直感的にはmouseenterを使うべきですが、そうではありません
  $n(".app-holder").addEventListener("mouseover", function (e) {
    console.log(e.target);
    console.log(e.target.nodeName);
    console.log(e.target.className || "クラスは空です");
    // 実際のコード
    if (e.target.nodeName === "IMG") {
      let src = e.target.getAttribute("src");
      src = src.replace("small", "original");
      e.target.setAttribute("src", src);
      let srcset = e.target.getAttribute("srcset");
      srcset = srcset.replace("small", "original");
      e.target.setAttribute("srcset", srcset);
    }
  }, false);
})();
読み込み中...
文章は、創作者によって署名され、ブロックチェーンに安全に保存されています。