1.1 基础 JavaScript 实例
<body> <script type="text/javascript"> document.write("<h1>Hello World!</h1>") </script> </body>
<body onload="message()"> <h1>页面还未显示前调用js</h1> <script type="text/javascript"> function message() { alert("该提示框是通过 onload 事件调用的。") } </script> </body>
<body onload="message()"> <p>上面的脚本声明了一个变量,为其赋值,显示该值,改变该值,然后再显示该值。</p> <script type="text/javascript"> var firstname; firstname="George"; document.write(firstname); document.write("<br />"); firstname="John"; document.write(firstname); </script> </body>
<body> <script type="text/javascript"> var x = navigator; document.write("CodeName=" + x.appCodeName); // 代码: document.write("<br />"); document.write("Name=" + x.appName); // 浏览器: document.write("<br />"); document.write("Version=" + x.appVersion); // 浏览器版本: document.write("<br />"); document.write("CookieEnabled=" + x.cookieEnabled); // 是否启用Cookies document.write("<br />"); document.write("CPUClass=" + x.cpuClass); document.write("<br />"); document.write("OnLine=" + x.onLine); document.write("<br />"); document.write("Platform=" + x.platform); // 平台: document.write("<br />"); document.write("UA=" + x.userAgent); // 浏览器的用户代理报头 document.write("<br />"); document.write("BrowserLanguage=" + x.browserLanguage); document.write("<br />"); document.write("SystemLanguage=" + x.systemLanguage); document.write("<br />"); document.write("UserLanguage=" + x.userLanguage); /* 运行结果: CodeName=Mozilla MinorVersion=undefined Name=Netscape Version=5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.90 Safari/537.36 CookieEnabled=true CPUClass=undefined OnLine=true Platform=Win32 UA=Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.90 Safari/537.36 BrowserLanguage=undefined SystemLanguage=undefined UserLanguage=undefined */ </script> </body>
<body onload="detectBrowser()"> <script type="text/javascript"> function detectBrowser() { var browser=navigator.appName; var b_version=navigator.appVersion; var version=parseFloat(b_version); if ((browser=="Netscape"||browser=="Microsoft Internet Explorer") && (version>=4)) {alert("您的浏览器够先进了!")} else {alert("是时候升级您的浏览器了!")} } </script> </body>
1.2 JavaScript字符串操作
<body> <script type="text/javascript"> var txt="Hello World!"; //1、字体变大、变小 document.write("<p>Big: " + txt.big() + "</p>"); document.write("<p>Small: " + txt.small() + "</p>"); //2、载体加粗、变斜体 document.write("<p>Bold: " + txt.bold() + "</p>"); document.write("<p>Italic: " + txt.italics() + "</p>"); //3、字体颜色、大小 document.write("<p>Fontcolor: " + txt.fontcolor("Red") + "</p>"); document.write("<p>Fontsize: " + txt.fontsize(16) + "</p>"); //4、字母大写、小写 document.write("<p>Lowercase: " + txt.toLowerCase() + "</p>"); document.write("<p>Uppercase: " + txt.toUpperCase() + "</p>"); //5、字体添加a标签属性 document.write("<p>Link: " + txt.link("http://www.w3school.com.cn") + "</p>"); //6、字体放到上角、下角 document.write("<p>Subscript: " + txt.sub() + "</p>"); document.write("<p>Superscript: " + txt.sup() + "</p>"); document.write("<p>Blink: " + txt.blink() + " (does not work in IE)</p>"); document.write("<p>Fixed: " + txt.fixed() + "</p>"); document.write("<p>Strike: " + txt.strike() + "</p>"); </script> </body>
<body> <script type="text/javascript"> var str="Visit Microsoft!"; document.write(str.replace(/Microsoft/,"W3School")) </script> </body>
1.3 JavaScript Math(算数对象)实例
<body> <script type="text/javascript"> document.write(Math.round(0.60) + "<br />"); //结果:1 </script> </body>
<script type="text/javascript"> document.write(Math.random()); // 0.05979463347692282 </script>
<script type="text/javascript"> document.write(Math.max(5,7) + "<br />"); // 运行结果:7 </script>
<script type="text/javascript"> document.write(Math.min(5,7) + "<br />"); // 运行结果:5 </script>