<!-- js一般是写在head标签里面 --> <script> document.write("我是天才!!"); document.write("我是废才!!"); </script>
<script> document.write("我是天才<br/>"); document.write("我是废才<hr/>"); document.write("我是鬼才 "); document.write("我是人才"); </script>
<!-- 1,书写位置:js是一种弱类型的语言,所以语法不是特别的严格,但是一般js代码是写在head标签里面 2, 执行顺序:js的解释执行是从上往下进行的。 --> <script> alert("哈哈"); alert("哼哼"); alert("嘎嘎"); </script>
<!-- 使用src属性导入外部的js文件 引入js文件需要占用一个script标签,执行代码时需要另取一个script标签 --> <script src="../js/mylove.js"></script> <script> var sum = getSum(2, 3); alert(sum); alert("我是来自于内部的js"); </script> mylove.js: alert("我是来自于外部的js文件代码"); function getSum(a,b){ return a + b; }
<script> // 由于javascript是一种弱类型语言,所以定义变量都是使用一个关键字var // 定义一个数字类型 var number = 10; // 定义一个字符串 var str = "aaabbb"; // 定义一个数组 var arr = [1,2,3,"haha","yue"]; </script>
<script> // 输入1-10之间的数字,如果大了则提示输入过大,如果小了则提示输入小了,在1-10之间则把输入的数字打印出来! var number= prompt("输入一个1-10之间的数字"); if(number > 10){ alert("你输入的数字大了!"); }else if(number < 1){ alert("你输入的数字小了!"); }else{ alert("你输入的数字为:" + number); } </script>
<script> // 1 警告框 alert("我是天才"); // 2 确认框,返回值为true则表示确认,false表示取消 var result = confirm("欲练此功必须自宫,你还练吗?"); if(result){ alert("自宫成功!"); }else{ alert("怂了吧!~?"); } // 3 提示框输入框 var name = prompt("请输入名字","王八"); if(name!=""&& name!=null){ alert("您输入的名字为:" + name); } </script>
<script> // 求和函数 function getSum(a, b) { return a + b; } var sum = getSum(3, 6); alert("和为:" + sum); // 定义重载函数 function add(){ alert("我是无参函数!"); } function add(i,j){ alert("我是有参函数!"); var sum = i + j; alert("有参函数和为:" + sum); } add(); // 调用无参的函数时,结果却是弹出有参的提示 // 这是因为js中的函数不能重载,只可以有一个同名函数,多了的会被最后的一个覆盖掉 add(2,4); // 正常输出 add(2,4,6); // 输出和仍为6,因为函数只有两个参数,多传入的值是无效的 </script>
<script> // 使用for循环求1-100的和 var sum = 0; for (var i = 1; i <= 100; i++) { sum += i; } alert("1-100的和是:" + sum); // 使用for循环打印九九乘法表 for (var i = 1; i <= 9; i++) { for (var j = 1; j <= i; j++) { document.write(j + "*" + i + "=" + j * i + " "); } document.write("<br/>"); } // for循环打印标题 for(var i = 1; i <=7;i ++){ document.write("<h"+i+">" +"我是"+ i + "级标题"+"<h"+i+">"); } // for循环遍历月份 document.write("<br>"+"<select>"); for(var i = 1; i <=12;i ++){ document.write("<option>"); document.write(i); document.write("</option>"); } document.write("</select>"); // 高级for,x是角标 var str = ["haha","hdhd",99,10,'ooo']; for(x in str){ alert(str[x]); } </script>
コードは次のとおりです
<script> /** * js中处理异常有两种方式,第一种是用try{} catch(){}语句块处理 * 还有就是你认为代码会出错时用throw关键字把错误跑出去,然后用catch里进行捕获 */ var count = 3 * 8; haha 让你输出不了; alert(count); function add(a, b) { try { hahahaha return a + b; } catch (err) { alert("出错了吧"); } } add(1,4); function value(){ var sum = prompt("输入1-100的数字:"); if(sum == "" || sum==null){ alert("输入为空啊"); return; } try{ if(sum > 100){ throw "e1"; }else if( sum < 1){ throw "e2"; }else{ alert("你输入的数字是:" + sum); } }catch(e){ if(e == "e1"){ alert("输入过大了"); }else if(e == "e2"){ alert("输入过小了"); } } } value(); </script>
<script> /** * window对面表示打开的浏览器对象,主要包括了五个子对象 * 1. Navigator 导航器对象 * 2. History 浏览器历史纪录 * 3. Screen 屏幕 * 4. Document 文档 * 5. Location 位置 */ </script> <script> function me_Navigator(){ document.write(navigator.appCodeName + "<br/>"); document.write(navigator.appVersion + "<br/>"); document.write(navigator.appName + "<br/>"); document.write(navigator.geolocation + "<br/>"); } me_Navigator(); // 上一步 function clickme(){ history.back(); } // 跳转 function tiancai(){ var result = confirm("要去百度官网吗?"); if(result){ location.href="index.html"; } } </script>
16. dom
<html> <head> <meta charset="utf-8"> <title></title> <script> // 电子显示时钟 function showTime(){ var date = new Date(); var canvas = document.getElementById("showcanvas"); var hours = date.getHours(); var min = date.getMinutes(); var sec = date.getSeconds(); canvas.innerHTML = "<h3>" + hours + ":" + min + ":" + sec + "</h3>"; } setInterval("showTime()",1000); // 倒计时显示器 var i = 0; var t = 0; function backTime(){ var date = new Date(); var canvas = document.getElementById("showcanvas"); var hours = date.getHours(); var min = date.getMinutes(); var sec = date.getSeconds(); canvas.innerHTML = "<h3>" + hours + ":" + min + ":" + sec + "</h3>"; i ++ ; if(i == 5){ clearInterval(t); } } t = setInterval("backTime()",1000); </script> </head> <body onload="backTime()"> <div id="showcanvas"></div> </body> </html>
17から始まりました。 HTMLタグを取得します
<script> var i = 0; var t; function image(){ document.getElementById("img").src="../img/"+ i +".png"; i ++; if(i == 7){ clearInterval(t); alert("画完了,好玩吧!"); } } t = setInterval("image()",1000); </script> </head> <body onload="image()"> <img id="img"/> </body>
{"picpath":"http://127.0.0.1:8020/Day03_javascript_%E4%BD%9C%E4%B8%9A/img/food/food1.jpg",
"desc":"九毛九"
}、
{"picpath":"http://127.0.0.1:8020/Day03_javascript_%E4%BD%9C%E4%B8%9A/img/food/food3.jpg",
"desc":"哥乐""desc":"ピザハット"
}、
{"picpath":"http://127.0.0.1:8020/Day03_javascript_%E4%BD%9C%E4%B8%9A/img/food/food5.jpg",
"説明":"KFC"
}、
{"picpath":"http://127.0.0.1:8020/Day03_javascript_%E4%BD%9C%E4%B8%9A/img/food/food6.jpg",
"desc":"永和王"
}、
{"picpath":"http://127.0.0.1:8020/Day03_javascript_%E4%BD%9C%E4%B8%9A/img/food/food7.jpg",
"desc":"紅莉村"
}
】
画像素材は以下の通りです
コードは以下の通りrreee
以上がJavaScript クイック スタート ケースのチュートリアルの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。