count <li>

@CassiusApr 02.2008

is there a way using javascript to count the number of <li> tags in a particular <ul>?

Thanks

to post a comment

@Ay__351_eApr 02.2008 — #

 <br/>
 &lt;script type="text/javascript"&gt;
 
 function count(){
 var ul = document.getElementById('ulid');
 var i=0, c =0;
 while(ul.getElementsByTagName('li')[i++]) c++;
 alert(c);
 }
 
 &lt;/script&gt;
 &lt;/head&gt;
 &lt;body&gt;
 &lt;input type="button" onclick="count()";&gt;
 &lt;ul id="ulid"&gt;
 &lt;li&gt;list 1&lt;/li&gt;
 &lt;li&gt;list 2&lt;/li&gt;
 &lt;li&gt;list 3&lt;/li&gt;
 &lt;li&gt;list 4&lt;/li&gt;
 &lt;li&gt;list 5&lt;/li&gt;
 &lt;/ul&gt;

 
 &lt;script type="text/javascript"&gt;
 
 function count(){
 var ul = document.getElementById('ulid');
 var li=ul.getElementsByTagName('li').length;
 alert(li);
 }
 
 &lt;/script&gt;
 &lt;/head&gt;
 &lt;body&gt;
 &lt;input type="button" onclick="count()";&gt;
 &lt;ul id="ulid"&gt;
 &lt;li&gt;list 1&lt;/li&gt;
 &lt;li&gt;list 2&lt;/li&gt;
 &lt;li&gt;list 3&lt;/li&gt;
 &lt;li&gt;list 4&lt;/li&gt;
 &lt;li&gt;list 5&lt;/li&gt;
 &lt;/ul&gt;

@CassiusauthorApr 02.2008 — #thank you for your help.

However is it possible to make that script as part of text in an html <p> tag.

For example, i would like to display "There are 6 records", where 6 is the number resulted from the script?

Thank You

@cootheadApr 02.2008 — #Hi there Cassius,

does this help...

[color=navy]
 &lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "http://www.w3.org/TR/html4/strict.dtd"&gt;
 &lt;html&gt;
 &lt;head&gt;
 &lt;title&gt;&lt;/title&gt;
 &lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"&gt;
 
 &lt;script type="text/javascript"&gt;
 window.onload=function() {
 var count=document.getElementById('records').getElementsByTagName('li').length;
 document.getElementById('report').firstChild.nodeValue='There are '+count+' records';
 }
 &lt;/script&gt;
 
 &lt;/head&gt;
 &lt;body&gt;
 
 &lt;ul id="records"&gt;
 &lt;li&gt;list item&lt;/li&gt;
 &lt;li&gt;list item&lt;/li&gt;
 &lt;li&gt;list item&lt;/li&gt;
 &lt;li&gt;list item&lt;/li&gt;
 &lt;li&gt;list item&lt;/li&gt;
 &lt;li&gt;list item&lt;/li&gt;
 &lt;/ul&gt;
 
 &lt;p id="report"&gt;&amp;nbsp;&lt;/p&gt;
 
 &lt;/body&gt;
 &lt;/html&gt;
 [/color]

[i]coothead[/i]

@CassiusauthorApr 02.2008 — #thank you very much

@cootheadApr 02.2008 — #[indent]No problem, you're welcome. ?[/indent]

count <li>

5 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

count <li>

5 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

5 Comments(s) _↴

Also in #JavaScript _↴