html 精美list,HTML DOM DList用法及代码示例

DOM DList对象用于表示HTML

用法:

document.getElementById("ID");<

其中“id”是分配给“dl”标签的ID。

示例1：

dl tag

h1,

h2 {

text-align:center;

}

h1 {

color:green;

}

dl {

margin-left:20%;

}

button {

margin-left:30%;

}

GeeksforGeeks

DOM DList Object

GeeksforGeeks

A Computer Science Portal For Geeks

Submit

function myGeeks() {

var g = document.getElementById("GFG").innerHTML;

document.getElementById("sudo").innerHTML = g;

}

输出：

在单击按钮之前：

单击按钮后：

示例-2：清单可以使用document.createElement方法创建对象。

dl tag

h1,

h2 {

text-align:center;

}

h1 {

color:green;

}

dl {

margin-left:20%;

}

button {

margin-left:30%;

}

GeeksforGeeks

DOM DList Object

Submit

function myGeeks() {

var g = document.createElement("DL");

g.setAttribute("id", "GFG");

document.body.appendChild(g);

var f = document.createElement("DT");

var text = document.createTextNode("GeeksForGeeks");

f.appendChild(text);

document.getElementById("GFG").appendChild(f);

var z = document.createElement("DD");

var text2 = document.createTextNode(

"A Computer Science PortaL For Geeks");

z.appendChild(text2);

document.getElementById("GFG").appendChild(z);

}

输出：

在单击按钮之前：

单击按钮后：

支持的浏览器：下面列出了DOM DList对象支持的浏览器。

谷歌浏览器

IE浏览器

Firefox

Opera

Safari