How to make scripts work on newly created elements
I'll go and mess with these scripts. Thanks again!
@wOxxOm No luck.. Could you please show me how would it work with @ahuanguchi highlight-external-links
// ==UserScript==
// @name highlight-external-links
// @namespace https://github.com/ahuanguchi
// @version 1.0.2
// @description Highlight all external links in lime green.
// @author ahuanguchi
// @match *://*/*
// @grant none
// @run-at document-start
// ==/UserScript==
window.addEventListener("load", function () {
function splitHref(givenHref) {
return givenHref.replace(/^https?:\/\//, "").split("/");
}
var i, currentA, currentHref, anchorParts, locationParts;
var anchors = document.getElementsByTagName("a");
var numAnchors = anchors.length;
for (i = 0; i < numAnchors; i += 1) {
currentA = anchors[i];
currentHref = currentA.href;
anchorParts = splitHref(currentHref);
locationParts = splitHref(window.location.href);
if (currentHref.slice(0, 4) === "http" && anchorParts[0] !== locationParts[0]) {
currentA.style.backgroundColor = "#bfff00";
}
}
});
Well, luck has nothing to do with it.
The script: Limegreen external links
It sure doesn't. Thank you :D
@wOxxOm on some websites like Tumblr dashboard, it would cover elements that are not needed. See the following screenshots..
http://i.imgur.com/nXirmta.png http://i.imgur.com/3VOvSyB.png
What do you think is the proper way to select and exclude these elements? or perhaps have them selected with a proper style?
Well, technically speaking those are external links.
To exclude by CSS selector edit the setMutationHandler's parameter: a[href*="//"]:not(.some-class)
or even a[href*="//"]:not(.some-class):not(#some-id):not(sometag)
P.S. instead of http
the script now looks for //
because many web pages don't specify the protocol.
Great! I just had to add && n.textContent !== ''
to exlude non texted elements. Thank you, specially for the awesome setMutationHandler function.
How to make scripts work on newly created elements
Many scripts are created to work on the page on loading only. Is there a simple way to make them work dynamically.
Here are examples of scripts in here..
Twitter Emoji for all sites
highlight-external-links