Making options from 0 to 100 with javascript-CodePudding

I need to make section with options in it going from 0 to 100 when the page is open, in html is simple just type it all out :D, but i think i can do this in java script but i am not quite sure how. Here is my html and a little bit of js code:

function options() {
            var section = document.getElementById("section");
                for(var i = 0;i < 100;i  ){
                    section.innerHTML = "<option value="i">" i "</option>";
            }
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

    <section id="section" onload="options">
        
    </section>

    

</body>
</html>

CodePudding user response：

Here's How you can do it -

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <select id="mySelect" onload="options()"></select>
</html>

<script type="text/javascript">
    var selectElem = document.getElementById("mySelect");
    for (var i = 0; i < 100; i  ){
      var element = document.createElement("option");
      element.innerText = i   1;
      selectElem.append(element);
    }
</script>

Here's the working example

CodePudding user response：

<section> tag doesn't support onload.

You can check w3schools onl oad event and MDN: onl oad, the tags support onload are: <body>, <frame>, <iframe>, <img>, <input type="image">, <link>, <script>, <style>

So you can move onload="options()" to <body> then escape the double quotes and use <select> instead of <section> as the comments mentioned.

function options() {
            var section = document.getElementById("section");
                for(var i = 0;i < 100;i  ){
                    section.innerHTML  = "<option value=\"i\">" i "</option>";
            }
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body onload="options()">

    <select id="section">
        
    </select>

    

</body>
</html>