<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
body{background-color:white;}
h1,p,h2{color:blue;background-color:#eeeeee;}
</style>
</head>
<body>
<h1 id="html_text">HTML Title</h1>
<p>HTML write</p>
<button type="button" onclick="alert('test')">Click please!</button>
<p align="center">
<button type="button" onclick="change_title()">ChangeTitle</button>
</p>
<script trype="text/javascript">
function change_title(){
x=document.getElementById("html_text");
x.innerHTML="<h2>JavaScript Title</h2>";
//此处是无心之举误写了标签<h2>原来的目的是只改变前面title <h1>的文本内容，可是运行结果不理解为什么文本内容字体变大了？？？求各位大神解惑，效果图附上
}
document.write("<p>Javascript write</p>");
</script>
</body>
</html>
点击changetitle按钮前：
点击后：
