Safari Extension - Changing Predefined Javascript Variables Values

Question

So what i am trying to achieve is to manipulate a javascript variable from a website, so that when I load the page it changes to a value I have pre determined (inmyscript.js).

In Safari's extension builder I have the following setup:

Access Level: All (To make sure it is running correctly for the time being)
Start Scripts: jquery.min.js (the jquery script)
End Scritps: myscript.js (myscript)

The Start Scripts, will load the jquery script, as I want to use jquery for some DOM manipulation. The End Script is the script which contains an overwrite for the variable I am trying to change in the html document.

Currently myscript.js looks like:

$(document).ready(function(){
    var numberImThinkingOf = 999;
});

For an example of what I am trying to do: The following page, prints out the value of numberImThinkingOf, by creating a new paragraph element every time the submit button is pressed.

So with out the extension it will print out

Value: 5
Value: 5
Value: 5

If pressed three times.

However I want my Safari Extension to change the default value of the numberImThinkingOf variable once all DOM elements are loaded, to that specified in myscript.js So that when I press the submit button it will output:

Value: 999

Ideally I don't want to manipulate the DOM so that it inserts another script element. I originally though that javascript attached variables to the window object. But I guess I was wrong. Event if I have a script such as

$(document).ready(function(){
    alert(numberImThinkingOf)
});

It returns undefined. :( Any help would me much appreciated.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script>
    var numberImThinkingOf = 5;
    function whatNumber(){
        var newElement = document.createElement("p");
        newElement.textContent = "Value: "+numberImThinkingOf;
        document.body.insertBefore(newElement, document.body.firstChild);
    }
    </script>
</head>

<body>
<input type="submit" value="Continue &rarr;" onclick="whatNumber()" />
</body>
</html>

Why are you loading jQuery as a start script? There's no reason to do that, start scripts are really only intended for scripts that need to interrupt resource loading. Just load it as your first end script. — Lily Ballard, Sep 07 '11 at 22:22

score 3 · Accepted Answer · answered Sep 07 '11 at 22:26

I believe your script and the page get different window objects, to avoid unexpected contamination. Here's what the Safari Extensions Development Guide says:

Injected scripts have an implied namespace—you don’t have to worry about your variable or function names conflicting with those of the website author, nor can a website author call functions in your extension. In other words, injected scripts and scripts included in the webpage run in isolated worlds, with no access to each others’ functions or data.

It sounds like you need to attach this variable to the DOM in some fashion, perhaps as an attribute of a tag.

score 2 · Answer 2 · edited May 23 '17 at 12:29

2

Content scripts are sandboxed, if you want to access parent page variables you have to inject <script> tag with your code. You can find some examples here.

edited May 23 '17 at 12:29

Community

1
1

answered Sep 08 '11 at 00:25

serg

109,619
77
317
330

Safari Extension - Changing Predefined Javascript Variables Values

2 Answers2