-1

I am learning javascript and i was wondering whether I can use a variable in this type of scenario. I need a different id for each HTML element I create with the function in javascript. Would this work

<script>
    var i=0;
    function add()
    {
        i++;
        var textbox = document.createElement("input");
        textbook.setAttribute("type","text");
        textbook.setAttribute("id",i);
    }
</script>

As you can see, I am trying to set the id on the element with the i variable and i am not sure if I can do that. Thanks.

No Idea For Name
  • 1

1 Answers1

-1

Numbers should not be used as ID's for compatibilty reasons.

( What are valid values for the id attribute in HTML? )

Apart from the typo this should work. You should also call your add function to see the effect.

var i=0;
var textboxAmount = 2;
    function add()
    {
        i++;
        var textbox = document.createElement("input");
        textbox.setAttribute("type","text");
        textbox.setAttribute("id",i);
        document.body.appendChild(textbox);
    }
for(var j = 0; j <= textboxAmount; j++){ 
  add()
}

https://jsfiddle.net/bbx1Lfup/5/

Sebastian Wybierek
  • 1
  • 3
  • html5 does allow you to use numbers as ids, you shouldn't use them for compatibility reasons (if html4 is still of concern). https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id – baao Jun 03 '18 at 13:34
  • @baao can you be a bit more specific? I don't know HTML too much in depth myself, but the topic he linked points directly to the spec which sais "the id attribute [...] must contain at least one character". I wouldn't doubt one second that browsers still run it anyways, but the answer "should not work" would be correct. – ASDFGerte Jun 03 '18 at 13:44
  • @ASDFGerte The answer he linked to is more than 10 years old and doesn't have any relevance in todays web developement. Check the link I posted to modern documentation – baao Jun 03 '18 at 13:50
  • @baao [HTML 5.3 W3C Working Draft, 26 April 2018](https://www.w3.org/TR/2018/WD-html53-20180426/dom.html#element-attrdef-global-id) - did apparently not change. – ASDFGerte Jun 03 '18 at 13:56
  • I think this is pretty clear (taken from the source you posted) _There are no other restrictions on what form an ID can take; in particular, IDs can consist of just digits, start with a digit, start with an underscore, consist of just punctuation, etc._ @ASDFGerte – baao Jun 03 '18 at 13:57
  • Maybe the wording means a digit it also a character? Anyways, thanks for elaborating, i guess the html spec is just confusing me a bit there. – ASDFGerte Jun 03 '18 at 13:59
  • Why confusing? :-) I haven't seen something more clear than the text in the big green box there... @ASDFGerte – baao Jun 03 '18 at 14:03
  • @baao Yes, the spec is long and i rarely look at every part. I only followed links and therefore looked at the text block above only. Writing "[...] must contain [...] one character" to mean "cant be empty" was confusing me, especially because my non-native-english mind somehow concluded "character" was [A-Za-z] for a moment. Thanks for clearing that up - not remembering wrong information is very important, that's why i ask when being confused :) – ASDFGerte Jun 03 '18 at 14:14