Welcome to WebmasterWorld Guest from 54.163.168.15

Forum Moderators: open

How do I get the text content of a link?

   
3:43 am on Jan 11, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Is there a way to get the text content of a link that has just been clicked?
6:50 am on Jan 11, 2006 (gmt 0)

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member



innerText

gph

9:15 am on Jan 11, 2006 (gmt 0)

10+ Year Member



or

element.firstChild.data

This will work on all of the links in a page. I don't know if your script will run before the link is followed. If not, it needs to be rewritten to return false then do location.href=element.href

onload=function(){
var els=document.getElementsByTagName('a'),
i=els.length;
while(i-->0)
els[i].onclick=function(){
alert(this.firstChild.data)
}
}

2:58 pm on Jan 11, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Thanks folks. I tried the code gph provided and it works perfectly with one exception. Obviously, the alert opens with the correct text, but I'm trying to write the text as a headline on the current page. Try as I might it opens in new window with document.write instead of writing at the current position. Your help is appreciated.

gph

2:07 am on Jan 12, 2006 (gmt 0)

10+ Year Member



I think I need more info. Correct me if I'm wrong.

You're using the link for the hover effect, not to load a new page. When the link is clicked the link text gets written into an <hx> tag?

Could you explain in more detail what you want it to do? Is there more than 1 link? Do they write to the same <hx> tag?

1:00 pm on Jan 12, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



What I have going on is this.

A menu is generated using a script like:

<SCRIPT language="JavaScript" type="text/javascript">
var currentLink;
var target = "_self";
var url = "thisPage.html";
var linkparams = 'onClick="currentLink=this.innerHTML"';
includeInterface('','links');
</SCRIPT>

Once a menu link is clicked an iframe is generated:

<SCRIPT type="text/javascript" language="JavaScript">
includeInterface(window.location.search.substring(1));
</SCRIPT>

The head contains a external script:

var interfaceOptions = '&iframew=550&iframeh=1040'

function includeInterface(options,file){
if(!file) file = 'my_interface';
options = interfaceOptions + (options? '&'+options : '');
document.write('<SCRIPT type="text/javascript" language="JavaScript" src="http://www.theirsite.com/codes/'+file+'.php?'+options+'"><'+'/SCRIPT>');}

This basically writes a menu and when a link is clicked it fills the iframe with the appropriate info. Always the same page, just the iframe content changes. My intent is to write the link text in the form of a headline above the iframe so people know what they are viewing. I don't have access to "their" code that generates the iframe else it would be easy.

To sum up, I want to capture that clicked link text and write it above the iframe....

Hope this make sense.

gph

5:29 am on Jan 13, 2006 (gmt 0)

10+ Year Member



If you need it, test this in IE5x and NN6. If it doesn't work change firstChild.data to innerHTML


<script type="text/javascript">

onload=function(){
var els=document.getElementsByTagName('a'),
i=els.length;
while(i-->0)
els[i].onclick=function(){
document.getElementById('headline').firstChild.data=this.firstChild.data
}
}

</script>

</head>
<body>
<h3 id="headline">Default Headline</h3>

9:54 am on Jan 13, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Although non-standard, and not supported in older non-IE, innerHTML may be safer.

Depending on how the HTML is written / interpreted, the element may contain more than one text-node. The contents would need to be normalised.

<h3>
Hello
</h3>

This might be considered by some clients to contain an empty text node before "Hello".

1:03 pm on Jan 13, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Well I tried each combination of firstChild.data and innerHTML without success. Only the Default Headline text would write.

gph

10:59 pm on Jan 13, 2006 (gmt 0)

10+ Year Member



I agree with Bernard, innerHTML is probably safer so I switched it in this example.

Jon_King, try this page.

<html>
<head>
<title>TEST</title>
<script type="text/javascript">
onload=function(){
var els=document.getElementsByTagName('a'),
i=els.length;
while(i-->0)
els[i].onclick=function(){
document.getElementById('headline').innerHTML=this.innerHTML
}
}
</script>
</head>
<body>
<h3 id="headline">Default Headline</h3>
<a href="#">text 1</a><br>
<a href="#">text 2</a><br>
<a href="#">text 3</a><br>
<a href="#">text 4</a>
</body>
</html>
4:14 pm on Jan 14, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Thanks folks all is working fine. I appreciate your help very much.
 

Featured Threads

My Threads

Hot Threads This Week

Hot Threads This Month