📌  相关文章
📜  HTML | DOM Ul 类型属性(1)

📅  最后修改于: 2023-12-03 15:31:12.697000             🧑  作者: Mango

HTML | DOM Ul 类型属性

HTML中的无序列表（unordered list）可以使用<ul>标签定义，列表项（list item）使用<li>标签定义。但是，使用JavaScript操作DOM（文档对象模型）时，需要使用Type属性来指定<ul>元素的类型。

语法

以下是指定<ul>元素类型的语法：

document.getElementByTagName("ul").type
属性值

以下是Type属性可用的值：

  • disc：此为默认值，使用实心圆点标记（不空心）作为列表项的标记。
  • circle：使用空心圆圈作为列表项的标记。
  • square：使用空心正方形作为列表项的标记。
示例

下面的代码演示了如何使用不同的Type属性值来指定<ul>元素的类型：

<!DOCTYPE html>
<html>
<head>
	<title>Ul 类型属性示例</title>
</head>
<body>
	<h2>无序列表示例</h2>
	<ul>
		<li>列表项1</li>
		<li>列表项2</li>
		<li>列表项3</li>
	</ul>
	<h2>使用 Type 属性改变列表项标记样式</h2>
	<ul type="circle">
		<li>列表项1</li>
		<li>列表项2</li>
		<li>列表项3</li>
	</ul>
	<ul type="square">
		<li>列表项1</li>
		<li>列表项2</li>
		<li>列表项3</li>
	</ul>
</body>
</html>

输出：

无序列表示例
  • 列表项1
  • 列表项2
  • 列表项3
使用 Type 属性改变列表项标记样式

○ 列表项1

○ 列表项2

○ 列表项3

□ 列表项1

□ 列表项2

□ 列表项3

总结

在编写使用JavaScript操作DOM的程序时，Type属性可以使无序列表更具有可读性和可访问性。