Read text in <li>

Collapse
This topic is closed.
X
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • cbartlett@gmail.com
    #1

    Read text in <li>

    If I have:
    <ul id="theUL">
    <li id="anLi1">som e text</li>
    <li id="anLi2">som e other text</li>
    <ul>

    How can I get the value of the text within the the li's?
    Any help much appreciated.
    thanks
    Charlie.

    Tags: None
    • Evertjan.
      #2
      Re: Read text in &lt;li&gt;

      wrote on 01 okt 2005 in comp.lang.javas cript:
      [color=blue]
      > If I have:
      > <ul id="theUL">
      > <li id="anLi1">som e text</li>
      > <li id="anLi2">som e other text</li>
      > <ul>
      >
      > How can I get the value of the text within the the li's?
      >[/color]

      Try:

      alert(document. getElementById( 'theUL').firstC hild.innerHTML)


      however the li id-s do not work in IE6


      --
      Evertjan.
      The Netherlands.
      (Replace all crosses with dots in my emailaddress)

        Comment

        • gibster
          #3
          Re: Read text in &lt;li&gt;

          Thanks for this, allthough I'm not sure I was 100% clear with my
          question, I want to reference a specific <li>'s by ID and get its
          text.

          I'm not that bothered about older browsers compatibility but IE6 and
          firefox are a must.

            Comment

            • BootNic
              #4
              Re: Read text in &lt;li&gt;

              > "cbartlett@gmai l.com" <cbartlett@gmai l.com> wrote:[color=blue]
              > news:1128181498 .340804.302220@ g49g2000cwa.goo glegroups.com.. ..
              >
              > If I have:
              > <ul id="theUL">
              > <li id="anLi1">som e text</li>
              > <li id="anLi2">som e other text</li>
              > <ul>[/color]
              ^ should be a closing tag </ul>[color=blue]
              >
              > How can I get the value of the text within the the li's?
              > Any help much appreciated.
              > thanks
              > Charlie.[/color]

              <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
              <html>
              <head>
              <title></title>
              </head>
              <body>
              <ul id="theUL">
              <li id="anLi1">som e text</li>
              <li id="anLi2">som e other text</li>
              </ul>
              <button onclick=
              "alert(document .getElementById ('anLi1').child Nodes[0].data)">anLi1</button>
              <br>
              <button onclick=
              "alert(document .getElementById ('anLi2').child Nodes[0].data)">anLi2</button>
              </body>
              </html>

              --
              BootNic Saturday, October 01, 2005 5:04 PM

              A man's got to do what a man's got to do. A woman must do what he can't.
              *Rhonda Hansome*

                Comment

                • gibster
                  #5
                  Re: Read text in &lt;li&gt;

                  Perfect!
                  thanks
                  Charlie.

                  PS. that closing ul tag was just a typo in the post, but well spotted.

                    Comment

                    • RobG
                      #6
                      Re: Read text in &lt;li&gt;

                      gibster wrote:[color=blue]
                      > Perfect!
                      > thanks
                      > Charlie.
                      >
                      > PS. that closing ul tag was just a typo in the post, but well spotted.
                      >[/color]

                      You may want to also considert using textContent for DOM 3 compliant
                      browsers (Mozilla et al and maybe IE one day) and innerText for IE.
                      That way your li can contain other markup that will be automatically
                      removed.

                      <script type="text/javascript">
                      function showContent( id )
                      {
                      var el = document.getEle mentById(id);

                      if ( el.textContent ){
                      alert(el.textCo ntent);
                      } else if ( el.innerText ){
                      alert(el.innerT ext);
                      }
                      }
                      </script>

                      <ul id="theUL">
                      <li id="anLi1"><b>s ome</b> <i>text</i></li>
                      <li id="anLi2"><spa n style="color:re d;">some</span> other text</li>
                      </ul>
                      <button onclick="showCo ntent('anLi1')" >anLi1</button>
                      <br>
                      <button onclick="showCo ntent('anLi2')" >anLi2</button>





                      --
                      Rob

                        Comment

                        • gibster
                          #7
                          Re: Read text in &lt;li&gt;

                          Thanks Rob,
                          I'll keep that in mind in case I need to add extra markup in the Li's
                          but for the time being I'll stick with BootNic's suggestion.
                          Cheers
                          Charlie.

                            Comment

                            Previous template Next
                            Working...