- JavaScript 能够改变页面中的所有 HTML 元素
- JavaScript 能够改变页面中的所有 HTML 属性
- JavaScript 能够改变页面中的所有 CSS 样式
- JavaScript 能够对页面中的所有事件做出反应
查找HTML 元素:
- 通过 id 找到 HTML 元素
- 通过标签名找到 HTML 元素
- 通过类名找到 HTML 元素
id
var x=document.getElementById("intro");
返回值是一个对象obj
标签名
var x=document.getElementById("main"); var y=x.getElementsByTagName("p");
通过类名
var x=document.getElementsByClassName("intro");
改变HTML属性
<img id="image" src="smiley.gif"><script>document.getElementById("image").src="landscape.jpg";</script>
该bainHTML样式(CSS)
document.getElementById(*id*).style.*property*=*新样式*
例子:
=========
<p id="p1">Hello World!</p><p id="p2">Hello World!</p>
<script>
document.getElementById("p2").style.color="blue";//颜色
document.getElementById("p2").style.fontFamily="Arial";//字体
document.getElementById("p2").style.fontSize="larger";//字号
</script>""
==========
使用事件
当事件被触发时执行代码:
<h1 id="id1">我的标题 1</h1> <button type="button" onclick="document.getElementById('id1').style.color='red'">点我!</button>
隐藏文本和显示文本语法:
<input type="button" value="隐藏文本" onclick="document.getElementById('p1').style.visibility='hidden'" /> <input type="button" value="显示文本" onclick="document.getElementById('p1').style.visibility='visible'" />