JavaScript动态创建div属性和样式示例代码_javascript技巧-js tutoriel-php.cn

JavaScript动态创建div属性和样式示例代码_javascript技巧

WBOY

Libérer： 2016-05-16 17:20:40

original

1272 Les gens l'ont consulté

1.创建div元素：

Javascript代码

 
 
functioncreateElement(){ 
varcreateDiv=document.createElement("div"); 
createDiv.innerHTML="Testcreateadivelement!"; 
document.body.appendChild(createDiv); 
} 
 

 
functioncreateElement(){ 
varcreateDiv=document.createElement("div"); 
createDiv.innerHTML="Testcreateadivelement!"; 
document.body.appendChild(createDiv); 
divFileitem.appendChild(divName);  
} 
 

2.创建div的属性：

Javascript代码

复制代码代码如下:

 
 
functioncreateElement(){ 
varcreateDiv=document.createElement("div"); 
createDiv.title="thisisanewdiv."; 
createDiv.id="newDivId"; 
createDiv.class="newDivClass"; 
createDiv.innerHTML="Testcreateadivelement!"; 
document.body.appendChild(createDiv); 
} 
 

 
functioncreateElement(){ 
varcreateDiv=document.createElement("div"); 
createDiv.title="thisisanewdiv."; 
createDiv.id="newDivId"; 
createDiv.class="newDivClass"; 
createDiv.innerHTML="Testcreateadivelement!"; 
document.body.appendChild(createDiv); 
 
createDiv.className = "name file_col"; 
} 
 

3.创建div的样式：

Javascript代码

复制代码代码如下:

 
 

functioncreateElement(){ 
varcreateDiv=document.createElement("div"); 
createDiv.style.background="pink"; 
createDiv.style.border="1pxsolidred"; 
createDiv.style.width="50px"; 
createDiv.style.height="50px"; 
createDiv.innerHTML="Testcreateadivelement!"; 
document.body.appendChild(createDiv); 
} 
 