I want to change the values of the buttons on the page with Tampermonkey, but I can't change it because it says the button is undefined?
HTML part
<div class="playbackRateButtons">
<span>Playback Speed : </span>
<button class="btn blue" value="0.5">0.5X</button>
<button class="btn blue" value="0.75">0.75X</button>
<button class="btn blue active" value="1">1X</button>
<button class="btn blue" value="1.25">1.25X</button>
<button class="btn blue" value="1.5">1.5X</button>
</div>
My Tampermonkey Script
// ==UserScript==
// @name Auto Change Speed
// @namespace http://tampermonkey.net/
// @version 0.1
// @description try to take over the world!
// @author You
// @match *://xxxxxx/*
// @icon data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @require http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @grant GM_xmlhttpRequest
// @connect xxxxxx.html
// ==/UserScript==
GM_xmlhttpRequest ( {
method: "GET",
url: "https://xxxxxx.html",
onload: changeSpeed()
});
function changeSpeed(response) {
var btns = document.getElementsByClassName("btn blue");
var speed = ["1", "2", "3", "5", "10"];
for (var i=0; i<5; i++) {
btns[i].value = speed[i];
btns[i].innerHTML = speed[i]+"X";
}
}
I have modified your changeSpeed
function. It tries to select the buttons at 1 second interval (you might want to update this interval). If found clearInterval
is called and the rest of the code is executed.
function changeSpeed(response) {
var intervalID = setInterval(function () {
var btns = document.getElementsByClassName("btn blue");
if (btns.length > 0) {
clearInterval(intervalID);
var speed = ["1", "2", "3", "5", "10"];
for (var i = 0; i < btns.length; i++) {
btns[i].value = speed[i];
btns[i].innerHTML = speed[i] + "X";
}
}
}, 1000);
}