Hoe overschrijf ik in JavaScript een self-invoking functie?

maandag 24 december 2018 23:06

Acties:

0 Henk 'm!

...

Topicstarter

Ik probeer een stukje JavaScript in een bestaande website te injecteren om zo het e.e.a. voor mijzelf gebruiksvriendelijker te maken. Tot nu toe is al veel gelukt, maar ik krijg het nog niet voor elkaar om een "self-invoking" functie te vervangen door een aangepaste functie.

Ik heb nu mijn testje zo staan:

HTML:

<html>
<head>
    <title>Main</title>
     <meta charset="UTF-8"> 
</head>
<body>
    <script>
        (function () {
            var x = 0;
            
            setInterval(Timer, 1000);

            function Timer() {
                x++;
                document.getElementById("TestP1").innerHTML = x;
                document.getElementById("TestP2").innerHTML = x;
            }
        })();
    </script>
    <p id="TestP1">Counter<p>
    <p id="TestP2">Counter<p>
    <p id="TestP3">Counter<p>
</body>
</html>

Ik gebruik Firefox 64.0, en via about:debugging laadt ik handmatig mijn aangepaste script in:

JSON:

{
  "manifest_version": 2,
  "name": "modify-page",
  "version": "1.0",

  "content_scripts": [
    {
      "matches": ["http://127.0.0.1/Test/*"],
      "js": ["Test.js"]
    }
  ]
}

En dit is mijn code van Test.js:

JavaScript:

(function () {
    var x = 0;
    
    setInterval(Timer, 1000);

    function Timer() {
        x--;
        document.getElementById("TestP2").innerHTML = x;
        document.getElementById("TestP3").innerHTML = x;
    }
})();

De scripts werken op zich prima. TestP1 telt naar boven op, en TestP3 telt naar beneden.
Helaas wordt bij het injecteren van het tweede script, het eerste script niet overschreven en het wordt er gewoon onder aan toegevoegt. (Dat is te zien dat TestP1 optelt.)
Hoe kan ik die eerste functie aanpassen (of verwijderen) terwijl ik geen voorgedefinieerde variabele heb waar ik met het tweede stukje JavaScript naar kan verwijzen?

Speel ook Balls Connect en Repeat

maandag 24 december 2018 23:18

Acties:

+1 Henk 'm!

Juup

Kan niet.
Je kunt er wel omheen werken door alle relevante id's in de HTML te veranderen.

Een wappie is iemand die gevallen is voor de (jarenlange) Russische desinformatiecampagnes.
Wantrouwen en confirmation bias doen de rest.

zondag 30 december 2018 11:44

Acties:

0 Henk 'm!

BarôZZa

Wat je hier hebt is een closure (google naar meer info zodat je het goed begrijpt). Het hele doel hiervan is juist dat wat erin staat private is en niet door andere scripts aangepast kan worden (tenzij je nadrukkelijk in de closure weer iets global maakt met window.yolovar = true, met makkelijkste hier is volgens mij om dat bij de setInterval te doen, want dan wordt deze overschreven, waardoor de eerste niet meer wordt uitgevoerd, als je dit heel vaak doet krijg je wel een memory leak)

[ Voor 26% gewijzigd door BarôZZa op 30-12-2018 11:47 ]

zaterdag 12 januari 2019 00:41

Acties:

0 Henk 'm!

Guido1982

Is er een bepaalde reden dat je het in een IIFE (Immediately Invoked Function Expression) hebt staan? Het (function{})() patroon. Dit gebruik je normaal inderdaad eigenlijk in twee situaties:

- Je wilt je Timer functie als closure gebruiken zoals eerder aangegeven zodat hij privé is en niet overschreven kan worden (wat juist is wat je wel wilt).
- Je wilt in een for-loop een functie aanmaken en direct gebruiken zonder alle iteraties de laatste iteratie te gebruiken.

Aangezien je niet loopt, weet je zeker dat je een IIFE nodig hebt?

zaterdag 12 januari 2019 00:57

Acties:

0 Henk 'm!

TomsDiner

Vat ik het goed samen:

We hebben een naamloze functie die een interval opzet voor een teller.
We voegen er een naamloze functie aan toe die ook een interval op een teller heeft[/i]

En nou moet de eerste uit...

Is het heel stom om de eerste functie een naam te geven, en parameter voor set en unset?

Op de unset zet je dan een clearinterval...

zaterdag 12 januari 2019 12:07

Acties:

0 Henk 'm!

Onbekend

...

Topicstarter

Het is een bestaande website wat zo'n functie heeft, en is inderdaad bedoeld als een soort timer (oneindige loop). Ik heb geen invloed op de gegenereerde code van de website, dus wil ik d.m.v. extra javascript de huidige functie overschrijven door een iets aangepaste code.

De codes die in mijn startpost staan heb ik zelf gemaakt a.d.h. van mijn bevindingen en om de basis van het het probleem te reproduceren en visueel weer te geven. De daadwerkelijke functie is veel complexer.

Speel ook Balls Connect en Repeat

Vraag

Alle reacties