SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    SitePoint Addict AtSea webdesign's Avatar
    Join Date
    May 2010
    Location
    Newark, Delaware
    Posts
    283
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    grabbing text from within a header tag

    I know this can be done with form elements but I'm curious if this can be done with headers.


    Code:
    <h3 id="headTxt">Blah Blah</h3>
    I'm trying to grab the Blah Blah text.

    I've tried innerHTML but to no avail. (Does it have to be wrapped in a container?) Or is innerHTML a replace only?

    Am I missing something easy?

  2. #2
    SitePoint Member
    Join Date
    Jul 2010
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It doesn't need to be wrapped in a container. Header elements should have the innerHTML property which is read/write.

    What's the output of
    Code:
    alert(document.getElementById("headTxt").innerHTML)

  3. #3
    SitePoint Addict AtSea webdesign's Avatar
    Join Date
    May 2010
    Location
    Newark, Delaware
    Posts
    283
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    alert doesn't work but in the error dialog it says the value is null

  4. #4
    SitePoint Member
    Join Date
    Jul 2010
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If you're getting an Error message then the call to document.getElementById("headTxt") is probably what's coming back as null.

    Do you have a URL?

  5. #5
    SitePoint Addict AtSea webdesign's Avatar
    Join Date
    May 2010
    Location
    Newark, Delaware
    Posts
    283
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    it's an internal page. I'm using it in conjunction with a breadcrumb script.

    Code:
    <script type="text/javascript">
    function breadcrumbs(){
        sURL = new String;
        bits = new Object;
        var x = 0;
        var stop = 0;
        var output = "<div class='bread'>";
    
        sURL = location.href;
        sURL = sURL.slice(8,sURL.length);
        chunkStart = sURL.indexOf("/");
        sURL = sURL.slice(chunkStart+1,sURL.length)
    
        while(!stop){
          chunkStart = sURL.indexOf("/");
          if (chunkStart != -1){
            bits[x] = sURL.slice(0,chunkStart)
            sURL = sURL.slice(chunkStart+1,sURL.length);
          }else{
            stop = 1;
          }
          x++;
        }
    
        for(var i in bits){
          output += "<a href=\"";
          for(y=1;y<x-i;y++){
            output += "../";
          }
          output += bits[i] + "/\">" + bits[i] + "</a> &raquo; ";
        }
        document.write(output + document.title);
    	document.write("</div>");
    	
      }
    
    </script>
    What I want to do is grab the text inside of the <h3> tag and display it in place of the document.title above.

  6. #6
    SitePoint Member
    Join Date
    Jul 2010
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    WHere's the <h3> tag? And I don't see the call to getElementById() in that function().

    Could it be getting called before the <h3> is available? Try setting a break point before you try to access it.

    If you're not seeing the alert() message and you're getting an error saying something is "null or not an object" then you aren't getting access to the element.

  7. #7
    SitePoint Addict AtSea webdesign's Avatar
    Join Date
    May 2010
    Location
    Newark, Delaware
    Posts
    283
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    the <h3> tag is in the first post. Right now the script above is grabbing the title. So I tried adding document.getElementById("headTxt").innerHTML in place of document.title and get nothing.

  8. #8
    SitePoint Member
    Join Date
    Jul 2010
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It's in the first post, but that doesn't provide any context for how the function is being called. Maybe you could make an example page public for review?

  9. #9
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,826
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    The only reason it could be returning null is if the call to retrieve the content of the heading is being made before the heading has loaded into the page.

    Try moving the JavaScript to the bottom of the page.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  10. #10
    SitePoint Addict AtSea webdesign's Avatar
    Join Date
    May 2010
    Location
    Newark, Delaware
    Posts
    283
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Beautiful Stephen that was it thanks!


Bookmarks

Posting Permissions

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