JavaScript... -sigh-

Associate
Joined
7 Dec 2007
Posts
302
Location
Derbyshire, Tibshelf
Why is it JavaScript is never as simple as it seems? :S
Hate it :P

Struggling to get this to work... even though im kinda confused as to why its not... reading up and stuff and this SEEMS like it should work

window.onload = function() {
var links = document.getElementById('resources').getElementsByTagName('li').getElementsByTagName('a');
var n = links.length;
for (var i = 0; i < n; i++) {
if (links.title && links.title != '') {
// add the title to anchor innerhtml
links.innerHTML += '<span>'+links.title+'</span>';
links.title = ''; // remove the title
}
}
}


html structure is:

<div class="navigation">
<ul id="resources">
<li><a href="#" title="whatever">some text</a></li>
</ul>


Thanks, as usual, java is driving me nuts over the most simplest things :P
 
javascript, not java ;)

Seems fine here.. maybe change:
Code:
(links[i].title && links[i].title != '')
to:
Code:
(links[i].title != '')
though.


oh, call the function at the end of the page, instead of window.onload, else it will execute before any of rest of the page is loaded in some browsers.
 
Last edited:
only thing that SEEMS to work is getElementsByTagName('a') but then obviously it applies it to EVERY link in the document :/
 
i've tried changing the ID of one link to res1, then doing this instead:

var links = document.getElementById('res1');

But it doesn't seem to grab it.. aggh I hate Javascript... and when im doing Java I hate that too... nothing seems to work the way you think it would, and everything seems to be DIFFERENT to anything else... iiiiiis it: .text or .carrot?!!?! mauhauha in java we decided on .carrot

stupid example but there you go :@
 
that would be because there is no comparison between JavaScript and Java. The only thing they have in common is they both have the letters J, A, and V in their names.
 
i've tried changing the ID of one link to res1, then doing this instead:

var links = document.getElementById('res1');

But it doesn't seem to grab it.. aggh I hate Javascript... and when im doing Java I hate that too... nothing seems to work the way you think it would, and everything seems to be DIFFERENT to anything else... iiiiiis it: .text or .carrot?!!?! mauhauha in java we decided on .carrot

stupid example but there you go :@

Have you tired calling the script at the end of the page?
 
doesn't work.... basically the only way to get JavaScript working is to throw my laptop out of the window. Jobs a good un
 
at a guess it's because HTMLCollection doesn't like getElementsByTagName()

give all the links a class and use getElementsByClassName() instead.

Code:
<html>
  <body onload="onLoad()"><div class="navigation">
<ul id="resources">
<li><a class="foo" href="#" title="whatever">some text</a></li>
</ul>
<button onclick="onLoad()" label="foo" />
<script type="text/javascript">
	/*<![CDATA[*/
	function onLoad() {
		var links = document.getElementsByClassName('foo');
		var n = links.length;
		for (var i = 0; i < n; i++) {
			if (links[i].title && links[i].title != '') {
				// add the title to anchor innerhtml
				links[i].innerHTML += '<span>'+links[i].title+'</span>';
				links[i].title = ''; // remove the title
			}
		}
	} 
	/*]]>*/
</script>
</body>
</html>
works..
 
Last edited:
The problem is that this bit:
document.getElementById('resources').getElementsByTagName('li')
returns an array of 'li' nodes.
so
Code:
var s = document.getElementById('resources').getElementsByTagName('li')[B][COLOR="Red"][0][/COLOR][/B].getElementsByTagName('a');
var n = s.length;
works.

obviously you have to loop around the 'li' nodes array to get all the 'a' nodes from each one but that shouldn't be too hard.

Simon
 
Last edited:
The problem is that this bit:
document.getElementById('resources').getElementsByTagName('li')
returns an array of 'li' nodes.
so
Code:
var s = document.getElementById('resources').getElementsByTagName('li')[B][COLOR="Red"][0][/COLOR][/B].getElementsByTagName('a');
var n = s.length;
works.

obviously you have to loop around the 'li' nodes array to get all the 'a' nodes from each one but that shouldn't be too hard.

Simon

I tried just haing by ID('res1') and making one of the ID as res1 for one single link... didn't work whatsoever, tried your code but im not really sure how I have to implement it anyways... think im gonna leave it anyways... Thanks for your help
 
And because I'm bored

Code:
window.onload = function() {

var s = document.getElementById('resources').getElementsByTagName('li');

for (var i = 0; i < s.length; i++) {
  var a=s[i].getElementsByTagName('a');
  for (var j = 0; j < a.length; j++) {
    if (a[j].title != ''){
      a[j].innerHTML += '<span>'+a[j].title+'</span>';
      a[j].title = '';
    }
  }
}
}
 
Thank you so much, the code you gave me worked great... I really need to start from scratch learning JavaScript (same with Java for uni) than jump into the stuff like this cause I can never figure out WHY something doesn't work...

I want to kiss you guys for your help :P
 
Thank you so much, the code you gave me worked great... I really need to start from scratch learning JavaScript (same with Java for uni) than jump into the stuff like this cause I can never figure out WHY something doesn't work...

I want to kiss you guys for your help :P

Look at something like JQuery or prototype. Esp JQuery - really like that :)
 
Back
Top Bottom