I am trying to write a userscript that will remove the effects of onselectstart from an id on a page.
So far I am assuming that I can rebind the original function using something like this:
document.getElementById('nodrag').onselectstart = function() { /* code original action */ };
JSFiddle
Any ideas would be appreciated.
Looks like I managed to work out the answer. Thank you LightStyle for giving me the hints.
So I create an script tag with document.getElementById('nodrag').onselectstart = function() { }; inside it and append this to the body.
// Create the script to remove the nodrag from chrome
var script = document.createElement('script');
script.type='text/javascript';
script.innerHTML = "document.getElementById('nodrag').onselectstart = function() { };";
var body = document.getElementsByTagName('body')[0];
body.appendChild(script);
This might not work in traditional contexts however works a charm on a userscript. Here is the final script:
https://gist.github.com/lgoldstien/5928021
Related
Dynamically appended script never loads:
const nodeTemplate = document.importNode(template.content, true)
const script = nodeTemplate.firstElementChild
script.removeAttribute('async')
script.setAttribute('defer', 'defer')
document.body.appendChild(nodeTemplate)
Any idea why? Is there a way to force it to load?
I've looked around at diverse solutions here and elsewhere and none seem to work as of now.
It works fine if it happens at page load.
I think you need to check whether it's loaded or not, if not, better to remove completely that script from the DOM, and then create new script tag.
And then try something like this, it's common pattern to inject script widgets:
// 1. remove your old script
// 2. create new
(function(){
var s = document.createElement('script');
s.type = 'text/javascript';
s.async = false;
s.defer = true;
s.src = "https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.1/anime.min.js";
document.getElementsByTagName('head')[0].appendChild(s);
})();
Hi I am working with a webservice and I have to manipulate the design to make it look better. Recently I had to make it work on IPad.
So my Problem is my edit's don't work in Iphone because the service adds if its a mobile device a viewport and an extra .js file. This is causing unwanted changes. So is there a way to prevent the system from loading / opening? I can use Javascript to do this. My recent trys was to get the "IPhone.js" and make it empty
var scriptElements = document.getElementsByTagName("script");
var patt = /iPhone.js/g;
var sourceOfElement = "";
for (var i = 0; i < scriptElements.length; i++) {
sourceOfElement = scriptElements[i].src;
if (patt.test(sourceOfElement)) {
scriptElements[i].src = "";
};
This didn't really worked because the IPhone.js is loaded before I can "make it empty".
Another try was to remove the viewport, this also did't worked.
So anybody have any idea how to prevent the service from loading/executing the IPhone.js?
can you add iphone.js via javascript not script tag?
It will be something like this:
if (shouldILoad) {
(function() {
var myscript = document.createElement('script');
myscript.type = 'text/javascript';
myscript.src = ('iphone.js');
var s = document.getElementById('myscript');
s.parentNode.insertBefore(myscript, s);
})();
}
If you don't want iphone.js to execute just add a return statement at the start of the iphone.js file if condition is matched
iPhone.js
if(YOUR_CONDITION_NOT_TO_EXECUTE_IPHONE_JS) return; //check for your condition and return
//Other iphone.js code
I'm trying to understand what's happening in my code.
So what I'm doing is
1. Iframe in a page - points to aspx page with some javascript. Worth noting its same domain so no issues with access.
2. Code in iframe window gets parent document object and injects requirejs into parent head with config in place to load my-custom-code.js
3. so my-custom-code.js is loaded into the head of the parent page and runs fine.
!!! This is what I don't get !!!
When I try to use window and document in my-custom-code.js they actually point to child(iframe) document and window???
So I want to understand HOW IT WORKS.
Thanks
UPDATE: iframe js file
var $doc = $(parent.document);
var head = $doc.find("head");
var body = $doc.find("body");
var reqConfigScript = "<script class='require-default-config'>var require = { deps: ['http:\/\/localhost/scripts/parent-main.js'], callback: function(main){ } };</script>";
body.append(reqConfigScript);
var parentScript = "<script src='http:\/\/" + location.host + "/scripts/require-2.1.11.min.js' type=\"text/javascript\"></script>";
head.append(parentScript);
Okay, it's a bit hard to guess because I don't know exactly how the library works... but try this:
parent.require = {
deps: ['http:\/\/localhost/scripts/parent-main.js'],
callback: function(main){ }
};
var parentScript = parent.document.createElement('script');
// important to use `parent.document` so the right document owns the script
parentScript.src = "http://"+location.host+"/script/require-2.1.11.min.js";
parentScript.type = "text/javascript";
parent.document.body.appendChild(parentScript);
I am developing a Firefox addon. What I want to do is to inject a custom JavaScript function.
i.e.
function foo() {..}
So all the pages can call the foo without define it first.
I have look from other answer such as: http://groups.google.com/group/greasemonkey-users/browse_thread/thread/3d82a2e7322c3fce
But it requires modification on the web page. What if perhaps I want to inject the function foo into Google.com? Is it possible to do so?
I can do it with a userscript, but I want to use the extension approach if possible.
The first thing I thought when reading your question was "this looks like a scam". What are you trying to achieve?
Anyway, here's a Jetpack (Add-on builder) add-on that injects a script in every page loaded:
main.js:
const self = require("self"),
page_mod = require("page-mod");
exports.main = function() {
page_mod.PageMod({
include: "*",
contentScriptWhen: "ready",
contentScriptFile: self.data.url("inject.js")
});
};
inject.js:
unsafeWindow.foo = function() {
alert('hi');
}
unsafeWindow.foo();
What if you make a simple href with javascript function on the page.
Like bookmarklets work.
Here is a sample code :
function(scriptUrl) {
var newScript = document.createElement('script');
// the Math.random() part is for avoiding the cache
newScript.src = scriptUrl + '?dummy=' + Math.random();
// append the new script to the dom
document.body.appendChild(newScript);
// execute your newly available function
window.foo();
}('[url of your online script]')
To use it, put your script's url.
It must be only one line of code, url formated, but for code readability I've formated it.
I've never developed a Firefox extension, but for javascript injection that's how I would roll.
Hope it helped.
You can use Sandbox
// Define DOMContentLoaded event listener in the overlay.js
document.getElementById("appcontent").addEventListener("DOMContentLoaded", function(evt) {
if (!evt.originalTarget instanceof HTMLDocument) {
return;
}
var view = evt.originalTarget.defaultView;
if (!view) {
return;
}
var sandbox = new Components.utils.Sandbox(view);
sandbox.unsafeWindow = view.window.wrappedJSObject;
sandbox.window = view.window;
sandbox.document = sandbox.window.document;
sandbox.__proto__ = sandbox.window;
// Eval your JS in the sandbox
Components.utils.evalInSandbox("function foo() {..}", sandbox);
}, false);
I have some code where I am trying to include a script file and then call a function inside the script file. The code is:
function includeJS(p_file) {
var v_js = document.createElement('script');
v_js.type = 'text/javascript';
v_js.src = p_file;
document.getElementsByTagName('head')[0].appendChild(v_js);
}
function checkFlash(){
includeJS('/scripts/swfobject.js');
var playerVersion = swfobject.getFlashPlayerVersion();
return playerVersion.major;
}
alert(checkFlash());
The problem is it is failing at checkFlash() where it tries to get the player version. I checked firebug and it shows the script is loaded and its reading the file correct, so its not a path issue.
I thought that maybe it was a delay issue in the includeJS function, but when I would that code in before the alert without it being a function, it still gives the same problem.
Any ideas on how I would accomplish something like this?
Thanks.
I think your problem is that the script file doesn't finish loading before you attempt to check the player version (just like you originally thought). You might want to try this:
function includeJS(p_file, callback) {
var v_js = document.createElement('script');
v_js.type = 'text/javascript';
v_js.src = p_file;
v_js.onreadystatechange = callback;
v_js.onload = callback;
document.getElementsByTagName('head')[0].appendChild(v_js);
}
function checkFlash(){
var playerVersion;
includeJS('/scripts/swfobject.js', function () {
var playerVersion = swfobject.getFlashPlayerVersion();
alert(playerVersion.major);
});
}
checkFlash();
This is a modified version of the solution presented in the accepted answer to this similar question.