Quick javascript question

Discussion in 'Web Design and Development' started by grimreaper1377, Jan 20, 2009.

  1. grimreaper1377 macrumors regular

    Joined:
    Oct 20, 2007
    #1
    Hi,

    I'm trying to use the following code to change the href attribute of a div:

    Code:
    <html>
    	<head>
    		<title>Index</title>
    	</head>
    	
    	<body>
    		<div id="subNav"></div>
    		<script type="text/javascript" charset="utf-8">
    			var subNav = document.getElementById('subNav');
    			subNav.setAttribute("href", "../index.html");
    			alert(subNav.href);
    		</script>
    	</body>
    </html>
    I can see that the alert pops up with "../index.html", but when I view the source code, it just shows <div id="subNav"></div>, the way it was before. Is the browser supposed to show the changed source code? I'm using Safari btw.

    Thanks!
     
  2. plinden macrumors 68040

    plinden

    Joined:
    Apr 8, 2004
    #2
    No, JavaScript changes how the HTML is rendered, not the HTML itself.

    However, I'm not sure what you're trying to do here. There is no href attribute for the div tag, so setting it doesn't actually do anything. You would get the same result with
    Code:
    <html>
    	<head>
    		<title>Index</title>
    	</head>
    	
    	<body>
    		<div id="subNav"></div>
    		<script type="text/javascript" charset="utf-8">
    			alert("../index.html");
    		</script>
    	</body>
    </html>
     
  3. kgarner macrumors 68000

    kgarner

    Joined:
    Jan 28, 2004
    Location:
    Utah
    #3
    I believe that when the document is loaded the source code is cached and that is what the View Source option pulls from. But the browser is actually using hte copy that exists in memory so the two are not in sync. If you use the Developer tools in Safari you should be able to verify that the href attribute is changed for the div. I know that it works that way in Firefox with Firebug. Not sure if the Developer tools in Safari behave the same way.
     
  4. kgarner macrumors 68000

    kgarner

    Joined:
    Jan 28, 2004
    Location:
    Utah
    #4
    The href attribute exists even if it isn't specified. So it can be modified. I agree that this script doesn't do much, but I think the OP is just trying to verify if the idea is correct. I doubt that is the actual script he/she is working on.
     
  5. grimreaper1377 thread starter macrumors regular

    Joined:
    Oct 20, 2007
    #5
    Yeah, I'm working through Simply Javascript. This is for demonstrative purposes. :p I guess I should try Safari's Developer Mode.
     
  6. angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #6
    JavaScript can change the HTML (through the DOM), though not the server version, just the local, which is generally all people are interested in. There isn't yet an href attribute for div, but XHTML2 is looking at being able to add href to virtually any tag, so it would be valid there, though that doesn't seem to be what the OP is doing, just practice.

    OP: If you're willing to use another browser, Firefox has some great extensions to help including Firebug, but also the Web Developer Toolbar. It has an option to View Generated Source code, which would give you exactly what you're looking for. I use it a bit myself to check my DOM manipulations.
     

Share This Page