HTML DOM DFN 对象
htmlweb developmentfront end technology更新于 2024/5/18 8:44:17
HTML DOM DFN 对象与 HTML <dfn> 元素关联。<dfn> 元素内的文本是在周围上下文中定义的文本。DFN 对象代表 <dfn> 元素。
语法
以下是语法 −
创建 DFN 对象 −
var p = document.createElement("DFN");
示例
让我们来看一个 HTML DOM DFN 对象的示例 −
<!DOCTYPE html>
<html>
<body>
<h2>DFN object example</h2>
<p>Click the below button to create a dfn element with some text inside it.</p>
<button onclick="dfnCreate()">CREATE</button> <br><br>
<script>
function dfnCreate() {
var x = document.createElement("DFN");
var t = document.createTextNode("The defination element");
x.appendChild(t);
document.body.appendChild(x);
}
</script>
</body>
</html>
输出
这将产生以下输出 −

点击"创建"按钮 −

我们首先创建了一个"创建"按钮,当用户点击该按钮时,它将执行 dfnCreate() 函数 −
<button onclick="dfnCreate()">CREATE</button>
dfnCreate() 方法使用 document 对象的 createElement() 方法创建一个 <dfn> 元素。然后,它使用 createTextNode() 方法创建一个文本节点。该文本节点随后作为子节点附加到 <dfn> 元素。最后,使用 appendChild() 方法将 <dfn> 元素以及文本节点作为文档主体的子元素附加 −
function dfnCreate() {
var x = document.createElement("DFN");
var t = document.createTextNode("The definition element");
x.appendChild(t);
document.body.appendChild(x);
}
相关文章
有用资源
html 参考教程 - 该教程包含有关 html 的更多信息:https://www.cainiaomax.com/html/

