Create input labels from "for" attribute, without changing HTML

Question

Having an issue learning JavaScript in a college course. This is my last project and the problem I am having with the HTML code is creating an input field for a label without an id, it has a "for" element though. It cannot be created with JQuery or JSON.

So the HTML looks something like this: <"label for="car">What car do you have? <"span class="required"><"/span><"/label">

So I was thinking I could create the input text field and add it to the DOM:

// Create the input field
var firstCar = document.createElement("input");
// Create the type node and store what the field will be text
var newType = document.createTypeNode("text");
// Create a new ID of car and attach it to the input
var newID = document.createIdNode("car")
/* put the created Element within the HTML with ["this determines which label it will be under"]:*/
var position = document.getElementByTagName("label")[1];
// Insert the element into the position
position.appendChild(firstCar);

I ran this and it says that TypeNode is not a function in my browser.

FYI - When an input element does not specify the type attribute, it defaults to <input type='text'>. — Scott Marcus
– Scott Marcus, Commented Apr 30, 2017 at 21:02
Our webpage changed and this is no longer a requirement. However, if someone would like to answer this still I would appreciate it to learn more about DOM manipulation. Thank you Marcus. — SikkoB
– SikkoB, Commented Apr 30, 2017 at 21:05

ibrahim mahrir · Accepted Answer · 2017-04-30 23:16:57Z

3

That's not how you set the type and id. Try this

var firstCar = document.createElement("input");

firstCar.type = "text"; // set the type

firstCar.id = "car";    // set the ID

var position = document.getElementsByTagName("label")[1]; // it should be getElements... not getElement...

position.appendChild(firstCar);

edited Apr 30, 2017 at 23:16

answered Apr 30, 2017 at 20:59

ibrahim mahrir

31.8k5 gold badges50 silver badges78 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Create input labels from "for" attribute, without changing HTML

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related