current community

your communities

more stack exchange communities

Stack Exchange
tour help
Take the 2-minute tour ×
Code Review Stack Exchange is a question and answer site for peer programmer code reviews. It's 100% free, no registration required.
up vote 2 down vote favorite

How can I told once: spanlist.addClass(text) and so over, once in code, so that it would work?

I have such code:

$(document).ready(function(){    
  if ($.browser.msie || $.browser.webkit && jQuery.browser.version.substr(0,1)<='6' && readCookie('already_submit')!=1) { 

    var iemessage = document.createElement("div");
      $(iemessage).addClass("ie-message");
      $('body').append(iemessage);   
      var frame = document.createElement("iframe");
        $(frame).addClass("nsframe");
        $(iemessage).append(frame);  

      var alerterror = document.createElement("div");
          $(alerterror).addClass("alert error");
          $(iemessage).append(alerterror);

      var close = document.createElement("div");
          $(close).addClass("close-text");
          $(alerterror).append(close);
          var textclose = document.createElement("div");
              $(textclose).addClass("text-img");
              $(textclose).text("close");
              $(close).append(textclose);

      var h2 = document.createElement("h2");
          $(h2).text("Sorry, your web-browser is outdated...");
          $(alerterror).append(h2);

      var h3 = document.createElement("h3");
          $(h3).text("Our site could be displayed not correctly in your browser.");
          $(alerterror).append(h3);

      var p = document.createElement("p");
          $(p).text("We recommend you install new version of web-browser:");
          $(alerterror).append(p);

      var spanlist = [spanchrome, spanfirefox, spanopera, spansafari, spanexplorer];
      var classlist =["browser-button chrome", "browser-button firefox", "browser-button opera", "browser-button safari", "browser-button ie"];
      var text = ["Google Chrome", "Mozilla Firefox", "Opera", "Apple Safari", "Internet Explorer"];
      var browserslist = document.createElement("div");
          $(browserslist).addClass("browsers-list");
          $(iemessage).append(browserslist);          

          var achrome = document.createElement("a");
              $(achrome).attr("href", "http://www.google.com/chrome");
              var spanchrome = document.createElement("span");
                  $(spanchrome).addClass("browser-button chrome");
                  $(spanchrome).text("Google Chrome");
                  $(achrome).append(spanchrome);

          var afirefox = document.createElement("a");
              $(afirefox).attr("href", "http://www.mozilla.com/firefox/");
              var spanfirefox = document.createElement("span");
                  $(spanfirefox).addClass("browser-button firefox");
                  $(spanfirefox).text("Mozilla Firefox");
                  $(afirefox).append(spanfirefox);

          var aopera = document.createElement("a");
              $(aopera).attr("href", "http://www.opera.com/download/");
              var spanopera = document.createElement("span");
                  $(spanopera).addClass("browser-button opera");
                  $(spanopera).text("Opera");
                  $(aopera).append(spanopera);

          var asafari = document.createElement("a");
              $(asafari).attr("href", "http://www.apple.com/safari/download/");
              var spansafari = document.createElement("span");
                  $(spansafari).addClass("browser-button safari");
                  $(spansafari).text("Apple Safari");
                  $(asafari).append(spansafari);

          var aexplorer = document.createElement("a");
              $(aexplorer).attr("href", "http://www.microsoft.com/windows/Internet-explorer/default.aspx");
              var spanexplorer = document.createElement("span");
                  $(spanexplorer).addClass("browser-button ie");
                  $(spanexplorer).text("Internet Explorer");
                  $(aexplorer).append(spanexplorer);           
      var links = [achrome, afirefox, aopera, asafari, aexplorer];      
          links.sort(function(){ 
            return Math.round(Math.random())-0.5; //so we get the right +/- combo
           }).slice(0,4);
          $(browserslist).append(links);

    $(iemessage).toggle();
    $('.close-text').mouseover(function() {
        $('.close-text').css({"border-bottom":"1px solid #000"});
        $('.close-text').css({"color":"#959595"});
        $('.close-text').css({"background":"url(/assets/browsers/button-close-hover.png) 100% 100% no-repeat"});
    });  
    $('.close-text').mouseleave(function() {
        $('.close-text').css({"border-bottom":"none"});
        $('.close-text').css({"color":"#4e4e4e"});
        $('.close-text').css({"background":"url(/assets/browsers/button-close.png) 100% 100% no-repeat"});
    });   
    $('.close-text').click(function() {
        $('.ie-message').hide();
        createCookie('already_submit', 1, 0);
    });          
  }

  function createCookie(name,value,days) {
    if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
    }
    else var expires = "";
    document.cookie = name+"="+value+expires+"; path=/";
  }

  function readCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1,c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
    }
    return null;
  }

  function eraseCookie(name) {
    createCookie(name,"",-1);
  }
});

as you see I want to refactor such partitions:

$(spanchrome).addClass("browser-button chrome");
                  $(spanchrome).text("Google Chrome");

How can I told once: spanlist.addClass(text) and so over, once in code, so that it would work?

When I write this it's not working properly:

$(document).ready(function(){    
  if ($.browser.msie || $.browser.webkit && jQuery.browser.version.substr(0,1)<='6' && readCookie('already_submit')!=1) { 

    var iemessage = document.createElement("div");
      $(iemessage).addClass("ie-message");
      $('body').append(iemessage);   
      var frame = document.createElement("iframe");
        $(frame).addClass("nsframe");
        $(iemessage).append(frame);  

      var alerterror = document.createElement("div");
          $(alerterror).addClass("alert error");
          $(iemessage).append(alerterror);

      var close = document.createElement("div");
          $(close).addClass("close-text");
          $(alerterror).append(close);
          var textclose = document.createElement("div");
              $(textclose).addClass("text-img");
              $(textclose).text("close");
              $(close).append(textclose);

      var h2 = document.createElement("h2");
          $(h2).text("Sorry, your web-browser is outdated...");
          $(alerterror).append(h2);

      var h3 = document.createElement("h3");
          $(h3).text("Our site could be displayed not correctly in your browser.");
          $(alerterror).append(h3);

      var p = document.createElement("p");
          $(p).text("We recommend you install new version of web-browser:");
          $(alerterror).append(p);

      var spanlist = [spanchrome, spanfirefox, spanopera, spansafari, spanexplorer];
      var browserslist = document.createElement("div");
          $(browserslist).addClass("browsers-list");
          $(iemessage).append(browserslist);          

          var achrome = document.createElement("a");
              $(achrome).attr("href", "http://www.google.com/chrome");
              var spanchrome = document.createElement("span");
                  $(spanchrome).addClass("browser-button chrome");
                  $(spanchrome).text("Google Chrome");
                  $(achrome).append(spanchrome);

          var afirefox = document.createElement("a");
              $(afirefox).attr("href", "http://www.mozilla.com/firefox/");
              var spanfirefox = document.createElement("span");
                  $(afirefox).append(spanfirefox);

          var aopera = document.createElement("a");
              $(aopera).attr("href", "http://www.opera.com/download/");
              var spanopera = document.createElement("span");
                  $(aopera).append(spanopera);

          var asafari = document.createElement("a");
              $(asafari).attr("href", "http://www.apple.com/safari/download/");
              var spansafari = document.createElement("span");
                  $(asafari).append(spansafari);

          var aexplorer = document.createElement("a");
              $(aexplorer).attr("href", "http://www.microsoft.com/windows/Internet-explorer/default.aspx");
              var spanexplorer = document.createElement("span");
                  $(aexplorer).append(spanexplorer);      
      var spanlist = [spanchrome, spanfirefox, spanopera, spansafari, spanexplorer];        
      var linktext = ["Google Chrome", "Mozilla Firefox", "Opera", "Apple Safari", "Internet Explorer"];
      var classlist =["browser-button chrome", "browser-button firefox", "browser-button opera", "browser-button safari", "browser-button ie"];
      jQuery.each(spanlist, function(i) {
        $(spanlist).text(linktext);
        $(spanlist).addClass(classlist);
      });     
      var links = [achrome, afirefox, aopera, asafari, aexplorer];      
          links.sort(function(){ 
            return Math.round(Math.random())-0.5; //so we get the right +/- combo
           }).slice(0,4);
          $(browserslist).append(links);

    $(iemessage).toggle();
    $('.close-text').mouseover(function() {
        $('.close-text').css({"border-bottom":"1px solid #000"});
        $('.close-text').css({"color":"#959595"});
        $('.close-text').css({"background":"url(/assets/browsers/button-close-hover.png) 100% 100% no-repeat"});
    });  
    $('.close-text').mouseleave(function() {
        $('.close-text').css({"border-bottom":"none"});
        $('.close-text').css({"color":"#4e4e4e"});
        $('.close-text').css({"background":"url(/assets/browsers/button-close.png) 100% 100% no-repeat"});
    });   
    $('.close-text').click(function() {
        $('.ie-message').hide();
        createCookie('already_submit', 1, 0);
    });          
  }

  function createCookie(name,value,days) {
    if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
    }
    else var expires = "";
    document.cookie = name+"="+value+expires+"; path=/";
  }

  function readCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1,c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
    }
    return null;
  }

  function eraseCookie(name) {
    createCookie(name,"",-1);
  }
});
share|improve this question
add comment

1 Answer

up vote 1 down vote

If I understand well, you could do something like this

var name = ['chrome','opera','firefox','explorer']
var text = ['Google Chrome','Opera','Mozilla Firefox','Internet Explorer']
var link = ['http://www.google.com/chrome','http://www.opera.com/download','http://www.mozilla.org','http://www.microsoft.com/windows/Internet-explorer/default.aspx']

 for (var i = 0 ; i < name.length ; i++){



    var alink = document.createElement("a");
    $(alink).attr("href", link[i]);
    var span = document.createElement("span");
    $(span).addClass("browser-button" + name[i]);
    $(span).text(text[i]);
    $(alink).append(span);

    $(browserslist).append(alink);

 }
share|improve this answer
    
I'd create a list of objects where the name, text and link is more tightly associated. E.g. var browsers = [{'browser':'chrome', 'text':'Google Chrome', 'link':'http://www.google.com/chrome'}, ...] –  Emil H Feb 17 '12 at 12:28
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.