<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <body> <h1>My Web Page</h1> <p id="myPar">I am a paragraph.</p> <div id="myDiv">I am a div.</div> <p> <button type="button" onclick="myFunction()">点击这里</button> </p> <script> function myFunction() { document.getElementById("myPar").innerHTML="Hello World"; document.getElementById("myDiv").innerHTML="How are you?"; } </script> <p>当您点击上面的按钮时，两个元素会改变。</p> <h1 id="myH1"></h1> <p id="myP"></p> <script> /* 下面的这些代码会输出 一个标题和一个段落 并将代表主页的开始 */ document.getElementById("myH1").innerHTML="Welcome to my Homepage"; document.getElementById("myP").innerHTML="This is my first paragraph."; </script> <p><b>注释：</b>注释块不会被执行。</p> <p>点击这里来创建变量，并显示结果。</p> <button onclick="myFunction()">点击这里</button> <p id="demo"></p> <script> function myFunction() { var carname="Volvo"; document.getElementById("demo").innerHTML=carname; } </script> <script> var carname1="Bill Gates"; var carname2='Bill Gates'; var answer1="Nice to meet you!"; var answer2="He is called 'Bill'"; var answer3='He is called "Bill"'; document.write(carname1 + "<br>") document.write(carname2 + "<br>") document.write(answer1 + "<br>") document.write(answer2 + "<br>") document.write(answer3 + "<br>") </script> <script> person=new Object(); person.firstname="Bill"; person.lastname="Gates"; person.age=56; person.eyecolor="blue"; document.write(person.firstname + " is " + person.age + " years old."); </script> <p>本例调用的函数会执行一个计算，然后返回结果：</p> <p id="demo"></p> <script> function myFunction(a,b) { return a*b; } document.getElementById("demo").innerHTML=myFunction(4,3); </script> </body> </html>