CODEWITHSUNDEEP
javascriptfor-loop
user986959
user986959

Reputation: 630

Reduce Javascript function length

I have a javascript function that looks like that:

function myfun(){
//product.1
var t1=document.getElementById('1').innerHTML;
var link = document.getElementsByClassName(t1);

if(document.getElementsByClassName(t1).length==1){
document.getElementById(t1).innerHTML=link[0].outerHTML;
document.getElementById(t1).getElementsByTagName('a')[0].className='dsad';

}
if(document.getElementsByClassName(t1).length==2){
document.getElementById(t1).innerHTML=link[0].outerHTML+'; '+link[1].outerHTML;
var element = document.getElementById(t1).getElementsByTagName('a')[0].className='dsad';
var element2 = document.getElementById(t1).getElementsByTagName('a')[1].className='dsad';
}...
//product.2
var t2=document.getElementById('2').innerHTML;

It goes like that till if(document.getElementsByClassName(t1).length==10) and then it continues element - document.getElementById('2') and so on until it reach Element number 10. The whole script is about 700 lines and I want to reduce it somehow. I was thinking of a for loop but I don't see how I could implement this. Any suggestions?

Upvotes: 2

Views: 286

Answers (4)

Fmrubio
Fmrubio

Reputation: 365

I am not sure about one part of your code. So I am going to assume that is different depending on the id.

The first I would do is to create a javascript object with the content that you want to include for your className

var classNameDictionary = { 0 : 'dsad', 1 :'dsad, ...};

Once you have this, then I will implement a for loop as following:

function myFun(numElements){
    for(var i = 0; i < numElements; i++) {
        var t = document.getElementById(''+i).innerHTML;
        var link = document.getElementsByClassName(t);
        document.getElementById(t).innerHTML = "";
        for(var j = 0; j < link.length; j++) {
            document.getElementById(t).innerHTML +=link[j].outerHTML;
            var element = document.getElementById(t).getElementsByTagName('a')[j].className = classNameDictionary[j];
        }

    }
}

I hope it helps

Upvotes: 2

Ray_Poly
Ray_Poly

Reputation: 173

function myfun(){
    for(i=1;i<=10;i++){
        var ti=document.getElementById(i).innerHTML;
        var link = document.getElementsByClassName("t" + i);

        if(link.length==1){
             link.innerHTML=link[0].outerHTML;
             ti.getElementsByTagName('a')[i - 1].className='dsad';

        }
        else if(link.length==2){
            ti.innerHTML=link[i - 1].outerHTML+'; '+link[i].outerHTML;
            var element = ti.getElementsByTagName('a')[i - 1].className='dsad';
            var element2 = ti.getElementsByTagName('a')[i].className='dsad';
        }
     }
}

Upvotes: 3

laaposto
laaposto

Reputation: 12213

Try:

for( i = 1; i <= 10; i++ ){  
  if( document.getElementsByClassName( t1 ).length == i ){
    document.getElementById( t1 ).innerHTML=link[i-1].outerHTML;
    document.getElementById( t1 ).getElementsByTagName( 'a' )[ i-1 ].className = 'dsad';
  }
}

EDIT:

If you want also the element id to be increased you should try:

for( i = 1; i <= 10; i++ ){  

var t1=document.getElementById(''+i).innerHTML;
var link = document.getElementsByClassName(t1);

      if( document.getElementsByClassName( t1 ).length == i ){
        document.getElementById( t1 ).innerHTML=link[i-1].outerHTML;
        document.getElementById( t1 ).getElementsByTagName( 'a' )[ i-1 ].className = 'dsad';
      }
    }

Upvotes: 5

DankMemes
DankMemes

Reputation: 2137

You could try this:

for(var id=1;id<=10;id++){
    var t1id=""+id;
    var t1=document.getElementById(t1id).innerHTML;
    var link = document.getElementsByClassName(t1);
    for(var num=1;num<=10;num++){
        if(document.getElementsByClassName(t1).length==num){
             document.getElementById(t1).innerHTML=link[0].outerHTML;
             document.getElementById(t1).getElementsByTagName('a')[0].className='dsad';
        }
    }
}

Upvotes: 3

Related Questions