replace href attribute in anchor element - javascript

I need a code for replace the href inside my <div> or in full html document (its same).
My content is look like:
<div class="entry-content post_content">
<center><img src="http://mysite.com/img/redirect.png" class="attachment-medium" alt="redirect-150x150-700x30" width="700" height="30"></center>
<!---Content-->
</div>
I need to change _http://mysite.com/go/ to http://mynewsite.com/go/
Any help ? what code should be?, im searching on stackoverflow but none thread solves my problem.

I am assuming you have some frontend (CMS?) access and no direct file access.
You can put it in the head section of every document.
function fixLinks(){
var links = document.getElementsByTagName('a');//Get all links
for(i = 0 ; i<links.length ; i++){//Loop throught links
var curLink = links[i].href // Cache
links[i].href = curLink .replace('mysite','mynewsite');//Replace mysite with my newsite and return the fixed string
}
}
window.onload = fixLinks;

Related

Changing image src depending on which word is in the element

I want to change the image displayed depending on which word is in the element, which will change frequently. I have tried using the indexOf method, to try and seach for the keyword which will decide whether to show a specific image in element 1 or element 2, but without luck.
<div class="main>
<h1 id="nextGame" onLoad="nextGames()">Aug 25, 2019: Home against Genoa</h1>
<p id="homeTeam"><img src="" id="teamHome"> vs <img src="" id="teamAway"></p>
</div>
<script>
var nextGame1 = document.getElementById("nextGame").indexOf("Home");
if (nextGame1 !== -1); {
document.getElementById("homeTeam").src = "asroma2.png";
} else {
document.getElementById("teamAway").src = "asroma2.png";
}
</script>
I expected my code to be able to see if the element "nextGame" had the string "Home" in it. If so, the image source of "homeTeam" would be changed to my specified src, and if not "teamAway" would be assigned the src.
This was clearly not the case.
Does anyone know what I did wrong?
Using document.getElementById("nextGame") will result in complete HTML Tag instead of the text present in the tag. You can use document.getElementById("nextGame").innerText to get the text inside the tags and then you can use the indexOf operator to identify if "Home" is present in it or not. The complete code will be written as follows:
<div class="main>
<h1 id="nextGame" onLoad="nextGames()">Aug 25, 2019: Home against Genoa</h1>
<p id="homeTeam"><img src="" id="teamHome"> vs <img src="" id="teamAway"></p>
</div>
<script>
var nextGame1 = document.getElementById("nextGame").innerText.indexOf("Home");
if (nextGame1 !== -1) {
document.getElementById("homeTeam").src = "asroma2.png";
} else {
document.getElementById("teamAway").src = "asroma2.png";
}
</script>
You have also closed the if statement with a semicolon and also used an additional closing bracket at the end, both of which will throw a syntax error.
I think you want to use something like
var nextGame1 = document.getElementById("nextGame").innerText.indexOf("Home");

How to query node-html-parser path with classes

I am stuck with node-html-parser (https://www.npmjs.com/package/node-html-parser). I read HTML into local variable and I am trying to get to the following node (JS path that is copied from Chrome):
#container > section > div > div.profile__main > div.item.item__profile > div.item__profile__info.cf > div.item__profile__info__data > p
Unfortuantely I get stuck at div.profile__main .
(profile__main is a class within div and the tag looks like <div class="profile__main" ...></div>
How do I query for this stuff. So far I got only here:
var root = this.HTMLParser.parse(this.data)
root.querySelectorAll("#container")
.querySelectorAll("section")
.querySelectorAll("div")
.querySelector("div.profile__main") // Cant get this one. returns null
Thanks
const root = this.HTMLParser.parse(this.data)
const itemProfileInfoData = root.getElementsByTagName("div").find(div => div.attributes.class === "item__profile__info__data")
itemProfileInfoData.childNodes.filter(child => child.tagName === "p")
Did you try something like
var root = this.HTMLParser.parse(this.data)
root.querySelectorAll(".item__profile__info__data")
.querySelectorAll("p")
Maybe last element, tag <p>, is loading async.
Please, check the "view source" of site that you parsing.

javascript if class x contains z get link of class y

i'm no js expert but need to execute some js in my applescript. Don't know if this is possible as the html page contains several instances of this div class.
If nested div class ".product_card__title" contains "my search term"
Extract href link from nested class ".js-search-product-link"
From main div with the class ".product_card"
A ANLTERNATIVE VERSION TO THE ONE ACCEPTED HERE IN THIS THREAD.
My Html:
<div class="product_card powersearch__product_card">
<a href="/shop/XYZ" class="js-search-product-link">
<div class="product_card__image" style="background-image:url(https://image.jpg);"></div>
<div class="product_card__title">SEARCH FOR THIS TITLE</div>
<div class="product_card__meta">€14</div></a></div>
What i have so far is:
tell application "Safari"
open location "https://teespring.com/search?q=rocker"
delay 5
set theLinks to (do JavaScript "Array.prototype.slice.call(document.querySelectorAll('.product_card')).map(function(d,i){var title = d.querySelector('.product_card__title'),link = d.querySelector('a');if(title && link && /Rocker/gi.test(title.textContent)){return link.href}})")
end tell
return theLinks
Replace yourSearchTerm with whatever you want to search below:
Array.prototype.slice.call(document.querySelectorAll(".product_card"))
.map(function(d,i){
var title = d.querySelector(".product_card__title"),
link = d.querySelector("a");
if(title && link && /yourSerchTerm/gi.test(title.textContent)){
return link.href
}
})
For all your divs with class of "product_card" it will return an array containing the hrefs, for the ones it could find, otherwise undefined
FIDDLE:
https://jsfiddle.net/ibowankenobi/gc6r2h3v/1/
As apple returns the last global value it might help to change the part where you set the theLinks variable:
set theLinks to (do JavaScript "someGlobal = Array.prototype.slice.call(document.querySelectorAll('.product_card')).map(function(d,i){var title = d.querySelector('.product_card__title'),link = d.querySelector('a');if(title && link && /Rocker/gi.test(title.textContent)){return link.href}})")

Showing div using anchor in URL

I am using the jQuery-collapse plugin to hide/show the body content of posts, and want each post to also be accessible by URL.
<div id="<?php the_slug(); ?>" data-collapse>
<div id="collapse">
// Toggle content
</div>
<div class="main-content">
// Hidden content
</div>
</div>
The method I am trying is to call the post slug as the post ID (so I can use #the_slug in the url), find it, and then give the first child of the collapser the class "open" (which the plugin should recognise). As follows:
window.onload = function() {
var hash = window.location.hash;
if(hash != "") {
var id = hash.substr(1);
var d = document.getElementById(id);
d.firstChild.className = "open";
}
};
It does work insofar as the class is applied to the first child, but the plugin doesn't acknowledge it (it does if I add class="open" to the markup).
Any help in understanding why / other options much appreciated.
The problem is that the lib does not listen to classname changes.
Fron the API of the plugin
$(d).children( ).eq(0).trigger("open");
Use this code instead of className assignment.
If you use jQuery, you can do:
if(hash != "") {
$(hash).addClass("open");
}

Search a page source for an attr, then find that attr's parent div

I'm wanting to find the parent div ID in javascript (or jquery), by searching HTML src for a specific attribute, or text.
Let's say that we're using this code:
<div id="ad_creative_1" class="ad-div mastad" style="z-index: 1;">
<script>(function() {var loaded = function() {return yt && yt.www && yt.www.home && yt.www.home.ads;};window.masthead_ad_creative_iframe_1_workaround = function() {if (loaded()) {yt.www.home.ads.workaroundIE(this);}};window.masthead_ad_creative_iframe_1_onload = function() {if (!loaded()) {setTimeout(masthead_ad_creative_iframe_1_onload, 50);return;}yt.www.home.ads.workaroundLoad();};})();</script>
<iframe id="ad_creative_iframe_1" src="http://ad-g.doubleclick.net/N4061/adi/com.ythome/_default;sz=970x250;tile=1;plat=pc;dc_dedup=1;kage=18;kar=3;kbsg=HPUS130404;kcr=us;kga=1001;kgender=m;kgg=1;klg=en;kmyd=ad_creative_1;"
height="250" width="970"
scrolling="no" frameborder="0" style="z-index: 1"
onload="masthead_ad_creative_iframe_1_onload();"
onmouseover="masthead_ad_creative_iframe_1_workaround(this)"
onfocus="masthead_ad_creative_iframe_1_workaround(this)"></iframe>
<script>
(function() {
var ord = Math.floor(Math.random() * 10000000000000000);
var adIframe = document.getElementById("ad_creative_iframe_1");
adIframe.src = "http://ad-g.doubleclick.net/N4061/adi/com.ythome/_default;sz=970x250;tile=1;plat=pc;dc_dedup=1;kage=18;kar=3;kbsg=HPUS130404;kcr=us;kga=1001;kgender=m;kgg=1;klg=en;kmyd=ad_creative_1;ord=" + ord + "?";
})();
</script>
</div>
Without knowing that the parent div is ad_creative_1, is it possible (and if so, how would i go about it?) to figure out the parent div by searching for a keyword within the source?
Say doubleclick.net is our keyword.
Can I search an html pages source, find doubleclick.net, and return the parent div of the section that has doubleclick.net in it?
How would i go about this?
You can use the "attribute contains" selector, and then just get the parent :
var parent = $('[src*="doubleclick.net"]').parent();
And for Gods sake don't post your actual adsense code or click it to test stuff, or move it or change it, as that will just end up with your account being closed.

Categories