试图用Greasemonkey为抽搐通道添加背景

Trying to add a background to a twitch channel with Greasemonkey

本文关键字:通道 添加 背景 抽搐 Greasemonkey      更新时间:2023-09-26

Twitch.tv曾为用户提供上传频道背景的功能,但早就取消了这一功能。我一直试图把它添加回来,但没有成功。

这就是我在这里工作的内容,来自twitch:

注意:ember###和databindattr-###="###"经常更改,所以我没有费心标记它们。

<div id="ember841" class="ember-view" data-channel="jimieo">
  <div class="content" data-bindattr-857="857">
    <div id="channel">
      <script id="metamorph-26-start" type="text/x-placeholder"></script>
      <script id="metamorph-26-end" type="text/x-placeholder"></script>
      <script id="metamorph-27-start" type="text/x-placeholder"></script>
      <script id="metamorph-28-start" type="text/x-placeholder"></script>
      <div id="ember872" class="ember-view"></div>
      <script id="metamorph-28-end" type="text/x-placeholder"></script>
      <script id="metamorph-27-end" type="text/x-placeholder"></script>
      <div class="player-column host-frame js-host-frame" data-bindattr-874="874"></div>
    </div>
  </div>
</div>

我试图使用以下方法使其发挥作用:

$(document).ready(function(){
    $("#data-channel=jimieo > div#channel").prepend("<canvas height="1080" width="1920" image="i.imgur.com/5su8sTX.jpg"></canvas>");
});

我的最终目标是。。。

<div id="ember841" class="ember-view" data-channel="jimieo">
  <div class="content" data-bindattr-857="857">
    <div id="channel">
      <canvas height="1080" width="1920" image="i.imgur.com/5su8sTX.jpg"></canvas>
      <script id="metamorph-26-start" type="text/x-placeholder"></script>
      <script id="metamorph-26-end" type="text/x-placeholder"></script>
      <script id="metamorph-27-start" type="text/x-placeholder"></script>
      <script id="metamorph-28-start" type="text/x-placeholder"></script>
      <div id="ember872" class="ember-view"></div>
      <script id="metamorph-28-end" type="text/x-placeholder"></script>
      <script id="metamorph-27-end" type="text/x-placeholder"></script>
      <div class="player-column host-frame js-host-frame" data-bindattr-874="874"></div>
    </div>
  </div>
</div>

不确定这是否是最好的方法,但只是通过浏览器控制台测试了它的工作原理。

$(document).ready(function(){
    $("<style type='text/css'> .js-directory, tse-content { background: #000000 url('http://i.imgur.com/5su8sTX.jpg') no-repeat fixed center !important; } </style>").appendTo("head");
});