Solved

Is there a tool to get a list of links on a web page?

Posted on 2012-03-16
10
527 Views
Last Modified: 2012-03-18
I want a list of links on some pages.  It would love to have a two column list with the link name on the left & the actual URL on the right, but a plain text list of link names would do.  

How could I get this without editing the page itself?
0
Comment
Question by:leslieinva
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 4
10 Comments
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 37732378
I could write you a bookmarklet if you want
A link on the link bar you can click to get the list you want.
Would that be what you were thinking about?
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 37732707
Or is this on your page?

Add

<script>
window.onload=function() {
  var links = document.links;
  var html = "<table>";
  for (var i=0,n=links.length;i<n;i++) {
    if (links[i].href!="") html += '<tr><td>'+
     links[i].textContent+
    '</td><td>'+links[i].href+
    '</td></tr>';
  }
  html +='</table>';
  var linksDiv = document.createElemen('div');
  linksDiv.style.height='250px';
  linksDiv.style.overflow='scroll';
  document.body.insertBefore(linksDiv,document.body.firstChild);
}
</script>

Open in new window

0
 

Author Comment

by:leslieinva
ID: 37732741
Hi mplungjan,

How do I turn your script into a bookmarklet?
0
On Demand Webinar - Networking for the Cloud Era

This webinar discusses:
-Common barriers companies experience when moving to the cloud
-How SD-WAN changes the way we look at networks
-Best practices customers should employ moving forward with cloud migration
-What happens behind the scenes of SteelConnect’s one-click button

 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 37732943
Change
Window.onload=
To
javascript:(
and the last } to
})()
0
 

Author Comment

by:leslieinva
ID: 37733096
After I do that, then how do I add it to my links bar?

I made the changes you suggested, then removed all the line breakes and pasted it into the URL for a bookmark.  I get no response from clicking on the bookmark.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 37733169
Sorry, forgot the double quotes and to add the innerHTML

Here

http://jsfiddle.net/mplungjan/GEPdP/
Drag the link in the bottom right field off to the links bar

And here is the code

<a href="javascript:(function() {var links = document.links;var html = '<table>';for (var i=0,n=links.length;i<n;i++) { if (links[i].href!='') html += '<tr><td>'+links[i].textContent+'</td><td>'+links[i].href+'</td></tr>';} html +='</table>';var linksDiv = document.createElement('div'); linksDiv.style.height='250px';linksDiv.style.width='500px'; linksDiv.style.position='absolute';linksDiv.style.top='0';linksDiv.style.zIndex=99999;linksDiv.style.overflow='scroll';linksDiv.innerHTML=html;document.body.insertBefore(linksDiv,document.body.firstChild);
})()">AllLinks</a>

Open in new window

0
 

Author Comment

by:leslieinva
ID: 37734926
This is almost exactly what I need!  The only problem is how do I get this info off the screen into a text format of any kind?  I can't read it with the transparent background or use the info anywhere else as it displays now.

Can you have it create a separate HTML file, like the "Search Links" bookmarklet does at https://www.squarefree.com/bookmarklets/pagelinks.html#search_links
0
 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 500 total points
ID: 37735006
1) add
linksDiv.style.background='white';
to get rid of the transparency
2)
change

var linksDiv = document.createElement('div'); linksDiv.style.height='250px';linksDiv.style.width='500px'; linksDiv.style.position='absolute';linksDiv.style.top='0';linksDiv.style.zIndex=99999;linksDiv.style.overflow='scroll';linksDiv.innerHTML=html;document.body.insertBefore(linksDiv,document.body.firstChild);
to
var w=window.open('','_blank');if (w) {w.document.write(html);w.document.close()}

to get all the links in a new window

Right now the table will take on the CSS of the parent page
0
 

Author Comment

by:leslieinva
ID: 37735058
YES!!!!

Many Thanks!!  

I'll give you more points if you can make the URL texts into real links in the output that open the linked pages into a new tab.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 37735083
You are welcome

With the points from this question I hit Overall Expert Point Total: 10,000,866
Giving me Savant Status.

jsFiddle with both bookmarklets

<a href="javascript:(function() {var links = document.links;var html = '<table>';for (var i=0,n=links.length;i<n;i++) { if (links[i].href!='') html += '<tr><td><a href=\''+links[i].href+'\'>'+links[i].textContent+'</a></td><td>'+links[i].href+'</td></tr>';} html +='</table>';var w=window.open('','_blank');if (w) {w.document.write(html);w.document.close()}
})()">AllLinks</a>

Open in new window

0

Featured Post

Get HTML5 Certified

Want to be a web developer? You'll need to know HTML. Prepare for HTML5 certification by enrolling in July's Course of the Month! It's free for Premium Members, Team Accounts, and Qualified Experts.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Do you come here a lot? Are you lazy like me and don't want to go through the "trouble" of having to click your Dock's Safari icon and then having to click your Experts Exchange Favorites bookmark to get here? Well then this article is for you.
I annotated my article on ransomware somewhat extensively, but I keep adding new references and wanted to put a link to the reference library.  Despite all the reference tools I have on hand, it was not easy to find a way to do this easily. I finall…
This Micro Tutorial will demonstrate how nuggets on the Web are formatted by using Chrome Developer Tools. These tools would not only view the site's CSS but it can also modify it and save the CSS to use on your own site.
Shows how to create a shortcut to site-search Experts Exchange using Google in the Chrome browser. This eliminates the need to type out site:experts-exchange.com whenever you want to search the site. Launch the Search Engine Menu: In chrome, via you…

634 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question