I'm creating a FF addon. I want to block all the URLs with .jpg (or any other user defined extension) in a page.
How to do it??
Presuming by URLs, you mean <a> elements, then the following code would remove all jpg/gif/png links which end with those extensions. If you wish to change it to images, you can change the elements that are searched from a to img, and change the search test from href to src.
Example on jsfiddle.
var m = document.getElementsByTagName("a");
var patt = new RegExp("^https?://(?:[a-z\-]+\.)+[a-z]{2,6}(?:/[^/#?]+)+\.(?:jpg|gif|png)$","i");
var removed = 0;
for (i=0; i<m.length;){
if (patt.test(m[i].href)){
// it got matched, remove it
m[i].parentNode.removeChild(m[i]);
removed++;
}else{
i++;
}
}
alert(removed+" image url's removed");
Related
I am trying to modify a site to make it open external links in a new tab.
Currently I have a loop which works fine except that it opens ALL links in a new tab which is not desired:
I have tried using filters but can't seem to get it to work properly.
<script>
document.addEventListener('DOMContentLoaded', function(){
let links = document.getElementsByTagName('a');
for(var i=0;i<links.length;i++){
links[i].setAttribute('target','_blank');
}
});
</script>
Maybe checking if the URL contains a Shopify handle or something along the line?
Thank you in advance!
You can check if the href attributes begins with http://, https:// or www. since those are the most common external links, all internal usually starts with /. (you can add an additional check if the href contains the domain name as well since it possible to have internal URL with the full URL)
So the code will become something like so:
document.addEventListener('DOMContentLoaded', function(){
const links = document.getElementsByTagName('a');
for(var i=0;i<links.length;i++){
const link = links[i];
const href = link.getAttribute('href');
if(href.match(/^((https?:\/\/)|(www\.))/) {
link.setAttribute('target','_blank');
}
}
});
Maybe something like this?
const links = document.querySelectorAll("a"); //get all <a> elements
links.forEach(el => { //loop trought all <a> elements
if(!el.href.includes(window.location.hostname)){ //if not this domain
el.setAttribute("target", "_blank");
}
})
/*just to show elements with target=_blank*/
[target="_blank"]{
color: green
}
other domain
this domain
Note: you don't need that document.addEventListener('DOMContentLoaded'... just put defer attribute on your <script> tag
To get only External links Open in new Tabs, you must use anchor’s property hostname, when its value not matching your “localhostname” string then overwriting anchor's property target default value "_self"(current browser content) to "_blank"(new tab) value, your script code will be:
<script>
document.addEventListener('DOMContentLoaded', function(){
let links = document.getElementsByTagName('a');
for(var i=0;i<links.length;i++){
if (links[i].hostname!="localhostname"){
links[i].setAttribute('target','_blank');
}
}
});
</script>
I'm trying to use javascript to iterate over an array of "magnet:.." links and download them iteratively.
I am using an iframe to download the link this way:
the HTML code:
<button ng-click="downloadSelected()">Get All Selected</button>
.
.
<iframe id='downloader_iframe'></iframe>
Inside the controller:
function downloadSelected(){
for (var i=0; i<$scope.magnets.length; i++){
document.getElementById('downloader_iframe').src = $scope.magnets[i];
}
}
The problem is that the action is happening only for the first link in the array while the rest of them ignored completely.
Is there any way to do it?
Make use of window.open or .click on an <a>, for example
function downloadSelected() {
var i;
for (i = 0; i < $scope.magnets.length; ++i) {
window.open($scope.magnets[i], '_blank');
}
}
I came here but actually found this solution/answer more helpful.
Creating a hidden iframe:
<iframe style="display:none" name="magnetframe"></iframe>
window.open(magnet_uri, 'magnetframe')
Im not sure how this would work with multiple magnet links, maybe if you use multiple iframes? (use 4 iframes and reload another magnet link every 0.5 second per frame so you can process 8 magnet links per second?)
another solution by using chrome API.
chrome.tabs.update({url: magnet_uri});
if you want to running at new tab, then add tab id in arguments
chrome.tabs.create({active: false}, function(tab) {
chrome.tabs.update(tab.id, {url: magnet_uri});
});
Once a first page is loaded nomally in my website, I request all other pages body contents with javascript ajax (ajaxObject).
I simply grab the body innerHTML with ajaxObject (javascript) and replace the actual one:
<script type="text/javascript">
function get(url) {
var myRequest = new ajaxObject(url, uGotAResponse);
myRequest.update('','GET');
}
function uGotAResponse(responseText,responseStatus) {
//Create a temp div to be able to use getElementById on it.
var theTempDiv = document.createElement('div');
//put the grabbed body innerHTML into it.
theTempDiv.innerHTML = responseText;
//my pages are like <body><div id="divcontent">content of pages here</div></body>
//so i get that div containing the innerHTML i really need.
var allDiv = theTempDiv.getElementsByTagName('div');
for (var i=0; i<allDiv.length; i++) {
if (allDiv[i].getAttribute('id') == 'divcontent') {
//i now replace the actual body innerHTML by the one i requested.
document.getElementById('divcontent').innerHTML=allDiv[i].innerHTML;
}
}
}
</script>
On a page, I have youtube objects for embed videos:
<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/1ahKNnolR30" height="315px" width="420px"><param name="movie" value="http://www.youtube.com/v/1ahKNnolR30"></object>
In Firefox everything is fine if I either load the page using the address or with that ajax code.
With IE, it works only if I go to the page using the address.
When I try to use the ajax code the videos appear as the image below.
I tried it with IE tester, all versions give me the same error behaviour.
Does anyone have a fix for this maybe?
As you can see, it looks like the object video is there, but looks like IE is not interpreting it because its loaded by ajax.
I'm using Tampermonkey, and I can't seem to get jQuery to work on it so this has to be Javacript only.
I'm trying to get a script to open (in a new window) the link of an item on a webpage. I've got a list of items I need to open, here is an example of those items:
<a class="market_listings" href="http://blabla.com/item1">...</a>
<a class="market_listings" href="http://blabla.com/item2">...</a>
<a class="market_listings" href="http://blabla.com/item3">...</a>
etc.
As you can see, the item is defined by a class and an href. The class is not unique, but the href is.
I'm new to programming but this is my idea on how to open specifically those links from the page:
The script gets elements with class="market_listings",
just to narrow down the search of hrefs on the page.
The script looks if the href of those elements corresponds with
"http://blabla.com/item*"
The script opens a new window with that href.
I have pretty much 0 experience with coding, but this is how I'd start it, considering I only want to open items 1 and 3:
function gethrefandopenwindow() {
var items = document.getElementsByClassName('market_listings')
//don't know how to code from here
if (*a href of items corresponds to*: 'http://blabla.com/item1')
{
*open new window to href of item1*
}
if (*a href of items corresponds to*: 'http://blabla.com/item3')
{
*open new window to href of item3*
}
else {
*refresh the page and start over*
}
}
As I said, I have barely programming experience, so I don't know if this is possible, and if it is and you're willing to help, please explain it to me like I'm a TOTAL idiot/newbie. :)
The only other way I could think of is this one: Javascript getElement by href? ; Except I don't know how to apply it in my situation due to my noobiness (and how to open a specific href out of the elements).
Anyway, I hope you can help me,
Thank you!
It looks like you had the right idea. This function might get you moving in the right direction.
function OpenHrefsInNewWindow() {
//Get reference to your elements
var items = document.getElementsByClassName("market_listings");
for (var i = 0; i < items.length; i++) //Loop through your elements
{
//Verify that the href starts with http://blabla.com/item
if (items[i].href.indexOf("http://blabla.com/item") === 0)
{
//If it does, open that URL in a new window.
window.open(items[i].href, "_blank");
}
}
}
Another way to write it:
function OpenHrefsInNewWindow() {
//Get reference to your elements
var items = document.getElementsByClassName("market_listings");
var i = 0;
while(i < items.length) //Loop through your elements
{
//Verify that the href starts with http://blabla.com/item
if (items[i].href.indexOf("http://blabla.com/item") === 0)
{
//If it does, open that URL in a new window.
window.open(items[i].href, "_blank");
}
i++; //Increment i here.
}
}
Can retrive the url of link taking value of atribute and do ankthing later
Url = $(this).attr ('href')
I tried with this code but, didn´t worked.
<a href="http://altodesign.pt/#portfolio" onClick="loadintoIframe('myframe,'portfolio/mmteam.html');">
you can try something like this
a href="javavcipt:document.getElementById('myframe').src = 'portfolio/mmteam.html';"
I would never use javascript ...
I have had a look into your webpage (plenty to learn, like add scripts to the end of the page, create a global javascript object to hold all website actions, etc ... but that's not the question)
I could see that, even thought you jump to #CONTACTOS you are not making the use of the hash at all... and you should!
using the hash would let you do things like:
http://altodesign.pt/#portfolio-cooptaxis
and that would jump to portfolio anchor and load the cooptaxis.html into the iframe and you stoped using javascript:loadintoIframe('myframe', 'portfolio/mmteam.html') at all, as that will cause Google Analytics and Crawlers not to follow up your links for example ...
your method could be something simple like
$(function() {
// let's see if we have an hash on the page
var hash = document.location.hash;
if(hash.length > 0) {
if(hash.instr('-') >= 0) {
// supposing will have only one char '-'
var img = hash.split('-')[1];
// let's remove the frame info from the hash
hash = hash.split('-')[0];
// there's a call to load into the iframe, let's load it
$("#myframe").attr("src", "portfolio/" + img + ".html")
}
// let's fly
jumpTo(hash);
}
// let's disable the anchor links by default and use the hash
$("a[href^=#]").click(function() {
// for all links that start with the hash, let's...
document.location.hash = $(this).attr("href");
return false;
});
$(window).bind('hashchange', function() {
// everytime the hash changes let's fly
jumpTo(document.location.hash);
});
});
function jumpTo(anchor) {
var a = $("a[name='" + anchor.replace('#','') + "']"),
pos = 0;
if(a.length > 0) {
// we have found the anchor, let's grab it's top position
pos = a.position().top;
}
// if we got here and pos === 0, we did not found the anchor
// for the given hash... maybe the user is playing around ...
// and we shall fly
$('body,html').animate({
scrollTop: pos
}, 800);
}
justthis will allow you to avoid using javascript to jump your links, as all they now have to have is simple: Portfolio
Let we say that you have page1.html in-which a link to page2.html you want it to be opened in an iframe in page1.html
in page1.html
link
<iframe name="iframe-name"></iframe>
Then you are able to add any anchor you want. It is just a matter of naming your iframe and then targeting it in the link!