DOM代码对象用于表示HTML <code>元素。代码元素由getElementById()访问。
用法:
document.getElementById("id");
其中‘id’是分配给代码标签的ID。
示例1:
<!DOCTYPE html>
<html>
<body>
<center>
<h1 style = "color:green; font-size:38px;">
GeeksForGeeks
</h1>
<h2>DOM code Object</h2>
<!-- Assigne id to CODE tag-->
<code id="GFG">
GeeksForGeeks:A computer science portal for geeks.
</code>
<br>
<br>
<button onclick="myGeeks()">Submit</button>
<script>
function myGeeks() {
var g = document.getElementById("GFG");
<!--Change the color of code element.-->
g.style.color = "coral";
}
</script>
</body>
</html>
输出:
在单击按钮之前:
单击按钮后:
示例-2:可以使用document.createElement方法创建代码对象。
<!DOCTYPE html>
<html>
<body>
<center>
<h1 style = "color:green; font-size:38px;" >
GeeksForGeeks
</h1>
<h2>DOM code Object</h2>
<br>
<button onclick="myGeeks()">Submit</button>
<script>
<!--Creating code element-->
function myGeeks() {
var g = document.createElement("CODE");
var f =
document.createTextNode("GeeksForGeeks:"
+"A computer science portal for geeks.");
g.appendChild(f);
document.body.appendChild(g);
}
</script>
</body>
</html>
输出:
在单击按钮之前:
单击按钮后:
支持的浏览器:下面列出了DOM Code Object支持的浏览器:
- 谷歌浏览器
- IE浏览器
- Firefox
- Opera
- Safari
相关用法
- HTML DOM Object用法及代码示例
- HTML DOM HTML用法及代码示例
- HTML KeyboardEvent code用法及代码示例
- HTML DOM Input Week用法及代码示例
- HTML DOM Column用法及代码示例
- HTML DOM Del用法及代码示例
- HTML DOM Embed用法及代码示例
- HTML DOM Header用法及代码示例
- HTML DOM Footer用法及代码示例
- HTML DOM Span用法及代码示例
- HTML DOM HR用法及代码示例
- HTML DOM button用法及代码示例
- HTML DOM Blockquote用法及代码示例
- HTML DOM BR用法及代码示例
- HTML DOM Meta用法及代码示例
- HTML Object name用法及代码示例
- HTML DOM Abbreviation用法及代码示例
- HTML DOM Aside用法及代码示例
- HTML DOM Bold用法及代码示例
- HTML DOM Bdo用法及代码示例
- HTML DOM Caption用法及代码示例
- HTML DOM Cite用法及代码示例
- HTML DOM Canvas用法及代码示例
注:本文由纯净天空筛选整理自ManasChhabra2大神的英文原创作品 HTML | DOM Code Object。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。