I want to extract href value from hyperlink through document.querySelector - javascript

var x = document.querySelectorAll(".indexed-biz-name");
for (i = 0; i < x.length; i++) {
document.write(x[i].innerHTML + "<br>");
}
When i run this code through greasemonkey it gives me output which is hyperlink in it. I want to extract the url within a same working.

Below is a snippet that does that you want
var links = document.querySelectorAll(".indexed-biz-name");
document.write('</br></br>')
for (i = 0; i < links.length; i++) {
document.write(links[i].getAttribute("href")+'</br>');
}
link1
<br/>
link2
<br/>
link3

Related

How to replace href of anchor tags with array of links?

// I am trying to replace href with array of links
var link = ['replaceLink1', 'replaceLink2'];
var links = document.querySelectorAll('a');
for(var i = 0; i < link.length; i++){
for(var j = 0; j < links.length; j++){
links[j].setAttribute('href',link[i]);
}
}
you don't need to loops just remove one and use the iterator to go throw both arrays
var link = ['replaceLink1', 'replaceLink2'];
var links = document.querySelectorAll('a');
for (var i = 0; i < link.length; i++) {
links[i].setAttribute('href', link[i]);
}
<a href="/link1" > click me ! </a>
<a href="/link2" >click me ! </a>
you can loop with for of loop each anchor tag in the page and replace the href attribute with the corresponding link from an array (that have to be the same size as all the links on the page otherwise you'll get undefined as a link) like so:
var linksToReplace = ['replaceLink1', 'replaceLink2'];
var links = document.querySelectorAll('a');
for (let [i, link] of links.entries()) {
link.setAttribute('href', linksToReplace[i]);
}
click me !
click me !

Javascript to "fix" all hrefs of class with regex

Say I have a bunch of links on a page like:
<a class="eg-vimeo1-element-0 eg-post-14" href="http://255972693" target="_self"><i class="eg-icon-play"></i></a>
And I want to change every http://255972693 to https://vimeo.com/video/255972693
I tried this to see my hrefs:
let e = document.getElementsByClassName("eg-vimeo1-element-0");
for (var i = 0; i < e.length; i++){
console.log(e[i].href);
console.log(e[i].href.replace("http://", "https://vimeo.com/video"));
}
<a class="eg-vimeo1-element-0 eg-post-14" href="http://255972693" target="_self"><i class="eg-icon-play"></i></a>
But it converts the href to an IP and gives results like
http://vimeo.com/video/15.65.213.85/
It will work if you use getAttribute on the href property.
const e = document.getElementsByClassName("eg-vimeo1-element-0")
for (var i = 0; i < e.length; i++) {
const href = e[i].getAttribute('href');
e[i].href = href.replace("http://", "https://vimeo.com/video/");
}
<a class="eg-vimeo1-element-0 eg-post-14" href="http://255972693">link</a>
Here's the updated jsFiddle.
And to preserve the comment from Niet the Dark Absol in case it disappears:
"The reason this works and .href doesn't is because .href is the resolved URL, and http://1234567 is interpreted as an IP address in decimal form."
Please try this:
let e = document.getElementsByClassName("eg-vimeo1-element-0");
for (var i = 0; i < e.length; i++){
var href = e[i].getAttribute('href');
console.log('previous href: ', href);
e[i].setAttribute('href', href.replace("http://", "https://vimeo.com/video/"));
console.log('new href:', e[i].getAttribute('href'));
}
<a class="eg-vimeo1-element-0 eg-post-14" href="http://255972693" target="_self"><i class="eg-icon-play"></i></a>
Try with getAttribute
let e = document.getElementsByClassName("eg-vimeo1-element-0");
for (var i = 0; i < e.length; i++){
var url = e[i].getAttribute('href');
alert(url.replace("https://", "https://vimeo.com/video/"));
}

How scan all <span> tags of a page and get or set a content?

I have this following code that scans all <input> tags of a page and then you are able to set you to get a value to this tag.
var input = document.getElementsByTagName('input');
for (var i = 0; i < input.length; i++) {
input[i].value = "123";
}
Now, how can I do the same with a <span> tag, which I already know does not have a property called value?
Your question was somewhat confusing, but I'll give my best answer:
Just take your code for the inputs, and change a few key componenents:
var span = document.getElementsByTagName('span');//Replace "input" with "span"
for (var i = 0; i < span.length; i++) {//Again, replacing "input" with "span"
var textInsideTheSpan = span[i].textContent;//Reading text inside span
span[i].textContent = "Your text here";//Writing text to the span
}
The key here is in the .textContent, a property of the javascript Node object, which can be read or written to, depending on your application. Everything else simply replaced "input" with "span".
Just use following:
var spans = document.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
var text = spans[i].innerHTML;
if (text.length == 0) {
spans[i].innerHTML = i; //Some text
}
}
You can use Node.textContent to set the text inside span:
var input = document.getElementsByTagName('span');
for (var i = 0; i < input.length; i++) {
input[i].textContent = "123";
}
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>

Using Javascript to Replace Link

I'm using this Javascript code in an attempt to replace the links on a page with a message that says "DOWNLOAD", with a hyperlink that leads to my registration page.
The problem is the "DOWNLOAD" text is not replacing the original link text. The original link is displayed. It does lead to the registration page, but again, the original link on the page is still visible as text.
Any ideas?
<script>
function replaceLinks() {
var links = document.getElementsByTagName('a');
for (var i = 0; i < links.length; i++) {
links[i].innerHtml = 'DOWNLOAD' +
'register here.';
links[i].href = 'register.php';
}
}
</script>
It should be:
function replaceLinks() {
var links = document.getElementsByTagName('a');
for (var i = 0; i < links.length; i++) {
links[i].innerHTML = 'DOWNLOAD register here.';
links[i].href = 'register.php';
}
}
The property is innerHTML, the last part is all uppercase. And you don't need to nest another link inside the link.
It looks like you have a capitalization issue - it should be innerHTML. You can also remove other parts of your code:
function replaceLinks() {
var links = document.getElementsByTagName('a');
for (var i = 0; i < links.length; i++) {
console.log(links);
links[i].innerHTML = 'DOWNLOAD';
links[i].href = 'register.php';
}
};
In jQuery way,
function replaceLinks() {
var links = $('a');
for (var i = 0; i < links.length; i++) {
links[i].html('DOWNLOAD register here.');
links[i].attr('href') = 'register.php';
}
}

Javascript: pattern HREF needs to be replaced

Suppose on my HTML page I have many hrefs to a link.
Using Javascript, I need to loop through all hrefs and replace them with something and I don't have any ids to a href.
Please help.
var anchors = document.anchors;
for(var i=0,len=anchors.length;i<len;i++){
anchors[i].href = 'some_new_url';;
}
Edit (after OP's comment)
document.anchors return anchors collection provide anchors have name attribute in them.
These are valid anchors for document.anchors
<a href='http://www.link1.html' name=''>Link1</a>
<a href='link2.html' name=''>Link2</a>
But this is not,
<a href='link2.html'>Link2</a>
Better, use this instead
var anchors = document.getElementsByTagName('a');
for(var i=0,len=anchors.length;i<len;i++){
anchors[i].href = 'some_new_url';;
}
<script type='text/javascript'>
var anchors = document.getElementsByTagName('a');
for(var i = 0; i < anchors.href; i++) {
anchors[i].href = 'new target';
}
</script>
...
<a href='link1.html'>Link1</a>
<a href='link2.html'>Link2</a>
Edit :
Just another way :
var length = document.links.length;
for (var i = 0; i < length; i++) {
document.links[i].href = 'new target';
}

Categories