如何默认选择跨度标签功能 - HTML

有时候，我们想指定HTML中的某个标签作为默认选项。这在表单中经常会用到，例如你希望默认选择性别中的男性，或者默认选中一个checkbox。这个任务可以通过使用HTML的“selected”属性来完成。下面就让我们一步步的来完成这个任务。

1. 例子

以下是默认选中标签的例子。我们来编写一个简单的表单，包含两种颜色的选择。

<form>
  <label for="color">选择颜色：</label>

  <select id="color">
    <option value="red" selected>红色</option>
    <option value="blue">蓝色</option>
    <option value="green">绿色</option>
  </select>

  <input type="submit" value="提交">
</form>

在这个例子中，我们为红色的选项添加了selected属性。

2. 如何使用

使用selected属性来指定默认选项：

<option value="red" selected>红色</option>

以上代码将把红色的选项设为默认选中项。我们也可以通过JavaScript来动态地指定默认选项：

document.getElementById("color").value = "red";

这是一个动态的例子，通过设置selected属性来设置默认值：

<form>
  <label for="fruit">选择你喜欢的水果：</label>

  <select id="fruit">
    <option value="apple">苹果</option>
    <option value="orange" selected>橘子</option>
    <option value="banana">香蕉</option>
    <option value="grape">葡萄</option>
  </select>

  <input type="submit" value="提交">
</form>

这个例子中，橘子的选项是默认选中的。

3. 总结

默认选择标签在HTML表单中是非常重要的。我们可以使用HTML的selected属性来完成这个任务。同时，我们也可以通过JavaScript来动态地设置默认选项。详细代码已在以上例子中给出，供参考。

返回的markdown代码片段如下：

# 如何默认选择跨度标签功能 - HTML

有时候，我们想指定HTML中的某个标签作为默认选项。这在表单中经常会用到，例如你希望默认选择性别中的男性，或者默认选中一个checkbox。这个任务可以通过使用HTML的“selected”属性来完成。下面就让我们一步步的来完成这个任务。

## 1. 例子

以下是默认选中标签的例子。我们来编写一个简单的表单，包含两种颜色的选择。

```html
<form>
  <label for="color">选择颜色：</label>

  <select id="color">
    <option value="red" selected>红色</option>
    <option value="blue">蓝色</option>
    <option value="green">绿色</option>
  </select>

  <input type="submit" value="提交">
</form>

在这个例子中，我们为红色的选项添加了selected属性。

2. 如何使用

使用selected属性来指定默认选项：

<option value="red" selected>红色</option>

以上代码将把红色的选项设为默认选中项。我们也可以通过JavaScript来动态地指定默认选项：

document.getElementById("color").value = "red";

这是一个动态的例子，通过设置selected属性来设置默认值：

<form>
  <label for="fruit">选择你喜欢的水果：</label>

  <select id="fruit">
    <option value="apple">苹果</option>
    <option value="orange" selected>橘子</option>
    <option value="banana">香蕉</option>
    <option value="grape">葡萄</option>
  </select>

  <input type="submit" value="提交">
</form>

这个例子中，橘子的选项是默认选中的。

3. 总结

默认选择标签在HTML表单中是非常重要的。我们可以使用HTML的selected属性来完成这个任务。同时，我们也可以通过JavaScript来动态地设置默认选项。详细代码已在以上例子中给出，供参考。