Velvet Star Monitor

Standout celebrity highlights with iconic style.

updates

CreateElement with id?

Writer Sophia Terry

I'm trying to modify this code to also give this div item an ID, however I have not found anything on google, and idName does not work. I read something about append, however it seems pretty complicated for a task that seems pretty simple, so is there an alternative? Thanks :)

g=document.createElement('div'); g.className='tclose'; g.v=0;
3

8 Answers

You should use the .setAttribute() method:

g = document.createElement('div');
g.setAttribute("id", "Div1");
4

You can use g.id = 'desiredId' from your example to set the id of the element you've created.

1
var g = document.createElement('div');
g.id = 'someId';
0

You can use Element.setAttribute

Examples:

g.setAttribute("id","yourId")

g.setAttribute("class","tclose")


Here's my function for doing this better:

function createElement(element, attribute, inner) { if (typeof(element) === "undefined") { return false; } if (typeof(inner) === "undefined") { inner = ""; } var el = document.createElement(element); if (typeof(attribute) === 'object') { for (var key in attribute) { el.setAttribute(key, attribute[key]); } } if (!Array.isArray(inner)) { inner = [inner]; } for (var k = 0; k < inner.length; k++) { if (inner[k].tagName) { el.appendChild(inner[k]); } else { el.appendChild(document.createTextNode(inner[k])); } } return el;
}

Example 1:

createElement("div");

will return this:

<div></div>

Example 2:

createElement("a",{"href":"","style":"color:#FFF;background:#333;"},"google");`

will return this:

<a href="">google</a>

Example 3:

var google = createElement("a",{"href":""},"google"), youtube = createElement("a",{"href":""},"youtube"), facebook = createElement("a",{"href":""},"facebook"), links_conteiner = createElement("div",{"id":"links"},[google,youtube,facebook]);

will return this:

<div> <a href="">google</a> <a href="">youtube</a> <a href="">facebook</a>
</div>

You can create new elements and set attribute(s) and append child(s)

createElement("tag",{attr:val,attr:val},[element1,"some text",element2,element3,"or some text again :)"]);

There is no limit for attr or child element(s)

3

Why not do this with jQuery?

var newDiv= $('<div/>', { id: 'foo', class: 'tclose'})
3
var element = document.createElement('tagname');
element.className= "classname";
element.id= "id";

try this you want.

I'm not sure if you are trying to set an ID so you can style it in CSS but if that's the case what you can also try:

var g = document.createElement('div');
g.className= "g";

and that will name your div so you can target it.

that is simple, just to make a new element with an id :

var myCreatedElement = document.createElement("div");
var myContainer = document.getElementById("container");
//setAttribute() is used to create attributes or change it:
myCreatedElement.setAttribute("id","myId");
//here you add the element you created using appendChild()
myContainer.appendChild(myCreatedElement);

that is all

1

Your Answer

Sign up or log in

Sign up using Google Sign up using Facebook Sign up using Email and Password

Post as a guest

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy