Comment créer un nouveau HTML case via JavaScript?

J'ai défini un bouton en HTML qui appelle une fonction pour créer un objet dans mon JS. En outre, je voudrais que ce bouton pour "spawn" la création d'une nouvelle case à cocher (avec le nom et la valeur selon l'ancien objet créé) en HTML, permet de dire que dans le div id XY.

Mais je suppose que ce n'est pas important, ici, est mon truc.

html

<input id="button" value="pick Brakiri" onclick="initiate('Brakiri')">

js

function initiate(faction){
calc = new Calc(faction)
}

Je voudrais éviter de jQuery si possible.

merci.

  • w3.org/wiki/Creating_and_modifying_HTML
  • Pourriez-vous expliquer mieux "avec le nom et la valeur selon l'ancien objet créé"? Sinon document.createElement sera la
  • var i = document.createElement('input'); i.type='checkbox';
InformationsquelleAutor | 2014-10-29
  1. 5

    Vous devez créer un functin pour cela. Un exemple, dans le cadre où vous passez à name et id et elle renvoie une marque nouvel élément: 

    function createNewCheckboxt(name, id){
    var checkbox = document.createElement('input'); 
    checkbox.type= 'checkbox';
    checkbox.name = name;
    checkbox.id = id;
    return checkbox;
}

    Après vous avez juste besoin de choisir le lieu de l'ajouter dans les DOM. Quelque chose comme:

    form.appendChild(createNewCheckboxt('theName', 'theID'));
    • Merci, cela fonctionne.
    InformationsquelleAutor Rikard
  2. 1

    Salut, je ne suis pas sur si je comprends votre question, mais ce le code pour créer une nouvelle case à cocher via javascript : 

    var checkbox = document.createElement('input');
checkbox.type = "checkbox";
checkbox.name = "name";
checkbox.value = "value";
checkbox.id = "id";    
container.appendChild(checkbox);
    InformationsquelleAutor web hobbit
  3. 1

    Vous pouvez créer un <input> élément avec type="checkbox" à l'aide de la document.createElement() méthode.

    Cela fonctionne:

    <!DOCTYPE html>
<html>
<body>

<p>Click the button to create a Checkbox.</p>

<button onclick="myFunction()">Try it</button>

<script>
function myFunction() {
    var x = document.createElement("INPUT");
    x.setAttribute("type", "checkbox");
    x.setAttribute("value", "abc");
    x.setAttribute("name", "xyz");

    document.body.appendChild(x);
}
</script>

</body>
</html>

    Référence

    InformationsquelleAutor AkshayP