CreateElement with id?

我试图修改这段代码,也给这个div项目一个ID,但是我没有在谷歌上找到任何东西,idName不起作用。我读过一些关于附加的东西,但是对于一个看起来很简单的任务来说,它似乎很复杂,所以有替代方案吗?谢谢:)

g=document.createElement('div'); g.className='tclose'; g.v=0;
639475 次浏览

你应该使用.setAttribute()方法:

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

你可以从你的例子中使用g.id = 'desiredId'来设置你创建的元素的id。

为什么不用jQuery来实现呢?

var newDiv= $('<div/>', { id: 'foo', class: 'tclose'})
var g = document.createElement('div');
g.id = 'someId';

你可以使用Element.setAttribute

例子:

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

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


下面是我做得更好的函数:

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;
}

示例1:

createElement("div");

将返回这个:

<div></div>

示例2:

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

将返回这个:

<a href="http://google.com" style="color:#FFF;background:#333;">google</a>

示例3:

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

将返回这个:

<div id="links">
<a href="http://google.com">google</a>
<a href="http://youtube.com">youtube</a>
<a href="http://facebook.com">facebook</a>
</div>

您可以创建新元素,设置属性并添加子元素

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

attr或子元素没有限制

我不确定你是否试图设置一个ID,这样你就可以在CSS中设置它的样式,但如果是这样的话,你也可以尝试:

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


g.className= "g";

它会给div命名这样你就可以瞄准它了。

var element = document.createElement('tagname');


element.className= "classname";
element.id= "id";

试试你想要的。

这很简单,只是创建一个带有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);

就这些

window.addEventListener('DOMContentLoaded', (event) => {
var g = document.createElement('div');
g.setAttribute("id", "google_translate_elementMobile");
    

document.querySelector('Selector will here').appendChild(g);
});