Count how many times it appears.

rkoya · Jan 13, 2006

Hello,

I have the below function, basically it is running a for loop then states if the first character of the currentsipp=='-' it alert the length. However, as they are in seperate divs, it is not counting the number of times it has found '-' is there anything I can add to this code to make it work, so that it gives me the total number of div's with '-'.

function countdiv(){

var sipps = document.getElementsByTagName("div");

for (i=0; i < sipps.length; i++){
var currentsipp = sipps.getAttribute("id")

if (currentsipp.charAt(0)=='-'){
alert (currentsipp.match(/-/g).length);
}
}
}

kaht · Jan 13, 2006

Let me pick apart your code and let you know what you're doing wrong:

Code:

function countdiv(){

   var sipps = document.getElementsByTagName("div");

   for (i=0; i < sipps.length; i++){
      [i][COLOR=grey]/* this line will get the id of the div, so if you had
         a div like this: <div id="-blah">-this-is-a-test</div>, 
         currentsipp would be set to the value "-blah" */[/color][/i]
      var currentsipp = sipps[i].getAttribute("id")
      [i][COLOR=grey]/* Here I believe that you are trying to compare the first
         character of text inside the div, when in fact you are
         comparing it to the first character of the id
         of the div, in my example above: -blah */[/color][/i]      
      if (currentsipp.charAt(0)=='-'){
         alert (currentsipp.match(/-/g).length);
      }
   }
}

So, to reference the text inside of the div you will have to do a bit of modification. Additionally, if you're wanting to keep track of all of the dashes in all of the divs, you'll need some sort of counter in your loop to hold them all. Here's a stab:

Code:

function countdiv(){
   [!]var totalDashes = 0;[/!]
   var sipps = document.getElementsByTagName("div");
   for (i=0; i < sipps.length; i++){
      var currentsipp = sipps[i].[!]innerHTML;[/!]
      if (currentsipp.charAt(0) == '-'){
         [i][COLOR=grey]//do not need to check for existance of null because we have
         //determined at least 1 exists in the if statement above[/color][/i]
         [!]totalDashes +=[/!] currentsipp.match(/-/g).length;
      }
   }
   [!]return totalDashes;[/!]
}

Now.... 1 major thing to consider.....

innerHTML will pull the actual html code straight from inside the div... So, that means that if you have done any sort of styling to the div, those tags will be included inside the div. Let me demonstrate what I mean:

Code:

<div id="blah">------This div will pass the test just fine-----</div>

innerHTML for this div looks like this:
[b]------This div will pass the test just fine-----[/b]


<div id="blah2"><span style="color:red">-------</span>This div will not pass the test even though it appears to start with red dashes</div>

innerHTML for this div looks like this:
[b]<span style="color:red">-------</span>This div will not pass the test even though it appears to start with red dashes[/b]

As you can see in the 2nd example, the innerHTML for the div starts with a "<" character, so it will not pass the if statement from the above code - even though on the screen it looks like the div starts with dashes. This may not be a problem for your project, but it might be something that you want to keep in your mind down the road in case it becomes a problem.

-kaht

How much you wanna make a bet I can throw a football over them mountains?

rkoya · Jan 16, 2006

Hi,

Thanks for that, I want all the dashes that are in the div but unsure of how to create the counter in the loop. Any hints/tips.

Thanks

rkoya

tsuji · Jan 16, 2006

This shows you what to expect.
[tt]
<html>
<head>
<script language="javascript">
function countdiv(){
var sipps = document.getElementsByTagName("div");
for (var i=0; i < sipps.length; i++){
var currentsipp = sipps;
if (currentsipp.innerHTML.match(/-/g)) {
alert (currentsipp.id+"\n# of dashes: "+currentsipp.innerHTML.match(/-/g).length);
} else {
alert (currentsipp.id+"\n# of dashes: 0");
}
}
}
window.onload=countdiv;
</script>
</head>
<body>
<div id="divid0">asf5-----5asdfdfs1-1adsf7-------7afd;total:5+7+1=13</div>
<div id="divid1">asf<span id="spanid0" style="color:red;">5-----5</span>asdfdfs1-1dfsadsf7-------7afd:total:13</div>
<div id="divid2">asf<span id="spanid-1" style="color:red;">5-----5</span>asdfdfs1-1dfsadsf7-------7afd:total:13+1(from id)</div>
</body>
</html>
[/tt]

rkoya · Jan 16, 2006

Thanks for your help guys. Much appreciated, works a treat.

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Count how many times it appears.

rkoya

IS-IT--Management

kaht

Programmer

rkoya

IS-IT--Management

tsuji

Technical User

rkoya

IS-IT--Management

Similar threads

Part and Inventory Search

Sponsor