JavaScript中如何创建仅含属性名无属性值的DOM元素？

在JavaScript中，创建仅含属性名而无属性值的DOM元素通常是指创建一个带有布尔属性的元素。布尔属性在HTML中通常表示一个开关状态，例如 disabled、checked、readonly 等。这些属性在HTML中只需要属性名，而不需要属性值。

以下是如何在JavaScript中创建这样的DOM元素的示例：

1. 使用 document.createElement 创建元素

首先，使用 document.createElement 方法创建一个元素。

const inputElement = document.createElement('input');

2. 设置布尔属性

然后，通过设置元素的属性来添加布尔属性。你可以直接将布尔属性设置为 true 或 false。

inputElement.disabled = true;  // 添加 disabled 属性
inputElement.checked = true;   // 添加 checked 属性

3. 将元素添加到DOM中

最后，将创建的元素添加到DOM中的某个位置。

document.body.appendChild(inputElement);

完整示例

// 创建一个 input 元素
const inputElement = document.createElement('input');

// 设置布尔属性
inputElement.disabled = true;  // 添加 disabled 属性
inputElement.checked = true;   // 添加 checked 属性

// 将元素添加到 body 中
document.body.appendChild(inputElement);

4. 使用 setAttribute 方法

你也可以使用 setAttribute 方法来设置布尔属性。在这种情况下，你只需要提供属性名，而不需要提供属性值。

inputElement.setAttribute('disabled', '');  // 添加 disabled 属性
inputElement.setAttribute('checked', '');   // 添加 checked 属性

5. 生成的HTML

生成的HTML代码将类似于以下内容：

<input disabled checked>

总结

在JavaScript中，创建仅含属性名而无属性值的DOM元素通常是通过设置布尔属性来实现的。你可以直接设置元素的属性为 true 或 false，或者使用 setAttribute 方法并省略属性值。