java按钮改变网页元素的技巧
1、思路:我们可以做一个变量控制按钮,让其来改变网页上的文本内容,这个控制的关键就是点击的触发,我们还可以建立一个鼠标事件,让其在划过按钮的时候引出一个窗口,这个窗口显示相关的信息。

2、整个java 按钮的代码设计流程。
<!DOCTYPE html>
<html>
<body>
<h1>java 按钮使用技巧</h1>
<p id="按钮">
java不仅仅可以改变网页。
<script>
function myFunction()
{
x=document.getElementById("按钮");
x.innerHTML="java 还能够改变世界!";
}
</script>
<button type="button" onclick="myFunction()" onMouseOut="alert('不小心出来了!')">点下试试</button>
</body>
</html>

3、上面的两个事件实现的方法有所不同,一个就是通过myFunction()来实现的,另外一个就是简单的onMouseOut事件。

4、java代码也可以改变网页上的图像。只要我们把图像地址设定为一个Function(),就可以实现图像之间的切换。而这个切换的引发就是鼠标或者按钮来进行的。

5、用java 代码做一个点击灯泡就开灯的效果。
<!DOCTYPE html>
<html>
<body>
<script>
function changeImage()
{
element=document.getElementById('我的灯泡')
if (element.src.match("开灯"))
{
element.src="/off.gif";
}
else
{
element.src="/on.gif";
}
}
</script>
<img id="我的灯泡" onclick="changeImage()" src="/i/eg_bulboff.gif">
点击就开灯
</body>
</html>

6、做一个改变网页文本颜色的按钮!
<!DOCTYPE html>
<html>
<body>
<h1>我要改变网页文本颜色</h1>
<p id="改变">
我就这样变色了!
<script>
function myFunction()
{
x=document.getElementById("改变")
x.style.color="#D02090";
}
</script>
<button type="button" onclick="myFunction()">来改变吧</button>
</body>
</html>
