2
\$\begingroup\$

Of course the when this select is comes with less options it will be better to leave it like this, and when it comes more then this it better to make it via loop. The question is that if I should make it loop or leave it as it is ? which way is the best and why ?

var htmlTemplate = 
    "<select class='action cycle' auto='1' value='24'>" +
        "<option value='6'>6 hours</option>" +
        "<option value='12'>12 hours</option>" +
        "<option value='24' selected=''>24 hours</option>" +
        "<option value='48'>48 hours</option>" +
        "<option value='72'>72 hours</option>" +
    "</select>";

Also, in my current project I'm making 'Add' button which creates some html dom elements. My question is if I should leave the code inside string or create it via javascript (createElement) and again, I would like to know what is the best way and why :)

var htmlTemplate = "class='target-unit' identify='blahblah'";
htmlTemplate = "<div " + targetTemplate + ">" +
                    "<span class='target-place'>" + targetPlace + "</span>" +
                    "<select class='action campaign'>" + targetOptions + "</select>" +
                    "<label input-label='' class='target-limit'>5000</label>" +
                    "<select class='action cycle' auto='1' value='24'>" +
                    "<option value='6'>6 hours</option>" +
                    "<option value='12'>12 hours</option>" +
                    "<option value='24' selected=''>24 hours</option>" +
                    "<option value='48'>48 hours</option>" +
                    "<option value='72'>72 hours</option>" +
                    "</select>" +
                    "<button class='action small button-icon add flr no-title' identify='target-add'></button>" +
                "</div>";
\$\endgroup\$
2
  • 1
    \$\begingroup\$ Why the downvote? I could see this question being split into two questions, but I don't think this necessitates a downvote, especially without explanation. \$\endgroup\$ Commented Nov 25, 2014 at 18:20
  • 1
    \$\begingroup\$ @GregBurghardt Not sure who downvoted, but my first reaction to this question was: There's nothing to review here. The Question doesn't seem to ask for a review of implementation as much as it asks for someone to decide between two alternatives. For a complete "review", there would likely need to be more code and / or more context. Just an observation. A question like this would potentially be on topic on SO, but on SO the answers to: which is better / faster, are already there. \$\endgroup\$
    – xDaevax
    Commented Nov 25, 2014 at 18:55

1 Answer 1

2
\$\begingroup\$

Personally I would create loops for this, it's very unreadable at the moment and you are repeating yourself a lot. Remember the DRY rule (don't repeat yourself). Also if you do it via loops it's easier to maintain and change in the future.

\$\endgroup\$
4
  • \$\begingroup\$ Thanks, and what do you think about the second question .. ? when I put the all html elements .. it is better to use string to create those elements ? or via createElement ? \$\endgroup\$
    – Ido
    Commented Nov 25, 2014 at 18:02
  • 1
    \$\begingroup\$ CreateElement for sure. Because if you save createElement in a variabel you can just re-use it over and over. \$\endgroup\$ Commented Nov 25, 2014 at 18:25
  • \$\begingroup\$ and let's say I won't re-use it ? and createElement will make more code then it is now ? createElement will be still better ? \$\endgroup\$
    – Ido
    Commented Nov 25, 2014 at 18:27
  • 1
    \$\begingroup\$ @Chrillewoodz: Reusing the value returned from document.createElement means you are using the same exact <select> object on the page each time you want this dropdown. What if the OP wants multiple dropdowns on this page? Reusing the createElement return value is not correct in this scenario. \$\endgroup\$ Commented Nov 25, 2014 at 18:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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