文章目录
- JavaScript 简介
- JavaScript 可以更改 HTML 内容
- JavaScript 可以更改 HTML 属性值
- JavaScript 可以更改 HTML 样式 (CSS)
- JavaScript 可以隐藏 HTML 元素
- JavaScript 可以显示 HTML 元素
- 总结
JavaScript 简介
本页包含一些 JavaScript 功能的示例。
JavaScript 可以更改 HTML 内容
众多 JavaScript HTML 方法之一是 getElementById()。
以下示例“查找”一个 HTML 元素（id=“demo”），并将元素内容（innerHTML）更改为“Hello JavaScript”：
示例
document.getElementById("demo").innerHTML = "Hello JavaScript";
JavaScript 接受双引号和单引号：
示例
document.getElementById('demo').innerHTML = 'Hello JavaScript';
JavaScript 可以更改 HTML 属性值
在此示例中，JavaScript 更改了 <img> 标记的 src（源）属性的值：
<!DOCTYPE html>
<html>
<body><h2>What Can JavaScript Do?</h2><p>JavaScript can change HTML attribute values.</p><p>In this case JavaScript changes the value of the src (source) attribute of an image.</p><button onclick="document.getElementById('myImage').src='pic_bulbon.gif'">Turn on the light</button><img id="myImage" src="pic_bulboff.gif" style="width:100px"><button onclick="document.getElementById('myImage').src='pic_bulboff.gif'">Turn off the light</button></body>
</html>
JavaScript 可以更改 HTML 样式 (CSS)
更改 HTML 元素的样式是更改 HTML 属性的一种变体：
示例
document.getElementById("demo").style.fontSize = "35px";
JavaScript 可以隐藏 HTML 元素
可以通过更改显示样式来隐藏 HTML 元素：
示例
document.getElementById("demo").style.display = "none";
JavaScript 可以显示 HTML 元素
也可以通过更改显示样式来显示隐藏的 HTML 元素：
示例
document.getElementById("demo").style.display = "block";
总结
本文介绍了JavaScript 简介，如有问题欢迎私信和评论
