www.webdeveloper.com
Results 1 to 3 of 3

Thread: Need help with DOM scripting

  1. #1
    Join Date
    Jul 2008
    Posts
    6

    Need help with DOM scripting

    Hi,

    I'm having trouble mastering DOM scripting, but I found this article which is about manipulating an HTML Unordered List; however I can't seem to get any of the code to work for me.

    Here's the link to the actual tutorial:
    http://www.lowter.com/article/too-easy-javascript-6


    and here's my code. I'm trying to get the section about changing the title attribute of an LI element to work. Please let me know what I'm doing wrong:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    	<head>
    		<title>DOM testing :-)</title>	
    		
    		
        <script type="text/javascript">
    	
    	
    	window.onload = initAll();
    	
    	function initAll()
    	{
    	var lowter = document.getElementById("lowter");
    	var lowter = document.getElementByTagName("a");
    	var lowter = all_links[0];
    	lowter.title = "visit Lowter.com";
    	lowter.style.fontSize = "150%";
    	}
    	</script>
    	
    	</head>
    	<body>
    	
    
    	<ul id="list">
        	<li><a href="http://www.lowter.com" id="lowter">Lowter</a></li>
        	<li><a href="http://www.gizone.co.uk" id="gizone">GiZone</a></li>
    	</ul>
    
    	</body>
    </html>

  2. #2
    Join Date
    Jun 2003
    Location
    here
    Posts
    4,551
    Code:
    		window.onload = initAll();
    	
    	function initAll()
    	{
    	var lowter = document.getElementById("lowter");
    	var lowter = document.getElementByTagName("a");
    	var lowter = all_links[0];
    	lowter.title = "visit Lowter.com";
    	lowter.style.fontSize = "150&#37;";
    	}
    Is wrong. You can either use:
    Code:
    window.onload = function ()
    {
    	var lowter = document.getElementById("lowter");
    	var lowter = document.getElementByTagName("a");
    	var lowter = all_links[0];
    	lowter.title = "visit Lowter.com";
    	lowter.style.fontSize = "150%";
    }
    Or
    Code:
    	function initAll()
    {
    	var lowter = document.getElementById("lowter");
    	var lowter = document.getElementByTagName("a");
    	var lowter = all_links[0];
    	lowter.title = "visit Lowter.com";
    	lowter.style.fontSize = "150%";
    }
    
    	window.onload = initAll;
    But there are no brackets on your assignment and the function must be declared before you can assign it to anything.

    And you only need to use var once. Once you've made lowter a local variable it remains a local variable.
    If you are using PHP please use the [PHP] and [/PHP] forum tags for highlighting...
    The same applies to HTML and the forums [HTML][/HTML] tags.

  3. #3
    Join Date
    Jul 2008
    Posts
    6
    Thank you, this is resolved. The second one work, but I removed a few lines that were inside of the function. The first one might have worked as well, but I didn't bother removing those few lines. Here's the working result:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    	<head>
    		<title>DOM testing :-)</title>	
    		
    		
        <script type="text/javascript">
    	
    	function initAll()
    {
    	var lowter = document.getElementById("lowter");
    	
    	lowter.title = "visit Lowter.com";
    
    }
    
    	window.onload = initAll;
    	</script>
    	
    	</head>
    	<body>
    	
    
    	<ul id="list">
        	<li><a href="http://www.lowter.com" id="lowter">Lowter</a></li>
        	<li><a href="http://www.gizone.co.uk" id="gizone">GiZone</a></li>
    	</ul>
    
    	</body>
    </html>

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles