js的引入方法
<!-- 方法1、在任何html页面非element元素中直接引入即可 -->
<!-- 方法2、外部引入js -->
<!-- 方法3、a标签的href引入 -->
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>JavaScrip基础·引入script的方法</title> </head> <body> <!-- 方法1、在任何html页面非element元素中直接引入即可 --> <script> document.write("我拥有一个世界，一个宽广美好的世界。"); </script> <hr/> <!-- 方法2、外部引入js --> <script src="js/demo1.js"></script> <hr/> <!-- 方法3、a标签的href引入 --> <a href="http://www.baidu.com" onclick="return confirm('是否跳转百度')">跳转http:www.baidu.com</a> </body> </html>
console.log用法
日志输出，我的输出位置在浏览器的程序开发模式里面的CONSOLE栏中。
主要是方便调式javascript用的，可以看到在页面中输出的内容，与alert相比，它能看到结构化的东西，而alert淡出一个对象就是[obujct object]，但comsole能看到对象的内容，console不会打断页面的操作。
相比alert他的优点是：
1、他能看到结构话的东西，如果是alert，淡出一个对象就是object object，但是console能看到对象的内容。
2、console不会打断你页面的操作，如果用alert弹出来内容，那么页面就死了，但是console输出内容后你页面还可以正常操作。
3、console里面的内容非常丰富，你可以在控制台输入console，然后就可看到。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>日志的使用方法·稍后说明变量</title> </head> <body> <script> // 日志输出使用方法 console.log("我是日志输出，我的输出位置在浏览器的程序开发模式里面的CONSOLE栏中"); </script> </body> </html>
变量定义与注释
/**
*
*
* 范围注释，有的时候还是很好用的。
*
*
*
*
*/
// 空的·没有发现/未定义
// var msg;
// console.log(msg);
// 字符串类型
// var str = "有一个男孩，很棒。";
// 因为可以单独输出一个字符，故而js中有char类型，但是由于
// js是弱类型，故而所有类型均可以用var来表示。
// console.log(str[0]);
// var str_char = '6';
// console.log(str_char);
// 布尔类型
// var isf = 5 > 2; //True
// console.log(isf);
// 浮点数类型可以显示小数点后15位的数字
// var x = 3.1415926535811111111111;
// console.log(x);
// var y = 6;
// var opt = "+";
// console.log(x + opt + y);
// console.log(eval(x + opt + y));
// console.log(eval("5+6+9+8+7*2-1*6/3+666"));
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>变量的声明与使用</title> </head> <body> <script> /** * * * 范围注释，有的时候还是很好用的。 * * * * */ /** */ /* var msg = null; console.log(msg); */ // 空的·没有发现/未定义 // var msg; // console.log(msg); // 字符串类型 // var str = "有一个男孩，很棒。"; // 因为可以单独输出一个字符，故而js中有char类型，但是由于 // js是弱类型，故而所有类型均可以用var来表示。 // console.log(str[0]); // var str_char = '6'; // console.log(str_char); // 布尔类型 // var isf = 5 > 2; //True // console.log(isf); // 浮点数类型可以显示小数点后15位的数字 // var x = 3.1415926535811111111111; // console.log(x); // var y = 6; // var opt = "+"; // console.log(x + opt + y); // console.log(eval(x + opt + y)); // console.log(eval("5+6+9+8+7*2-1*6/3+666")); </script> </body> </html>
js闰年判断方法
1582年以来的置闰规则：
普通闰年：公历年份是4的倍数，且不是100的倍数的，为闰年（如2004年、2020年等就是闰年）。
世纪闰年：公历年份是整百数的，必须是400的倍数才是闰年（如1900年不是闰年，2000年是闰年）。
1582年以前的惯例：四年一闰；如果公元A年的A（正数）能被4整除，那么它就是闰年；如果公元前B年的B（正数）除以4余1，那么它也是闰年。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>分支语句·闰年判断</title> </head> <body> <script> // 判断闰年的if语句 var year = 2100; if (year % 4 == 0 && (year % 100 != 0 || year % 400 == 0)) { document.write("闰年"); } else { document.write("平年"); } </script> </body> </html>
if单分支、双分支、多分支语句
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>if多分支语句</title> </head> <body> <script> // 其中0-4可以代表任何事情 var num = 2; if (num == 0 || num == 2 || num == 3) { //0-2-3任何事情 document.write("田思龙"); document.write("贾正岩先生") } else if (num == 1) { //没钱花了 document.write("家长"); } else if (num == 4) { //找食堂 document.write("食堂"); } else { document.write("找自己"); } </script> </body> </html>
switch开关
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>switch</title> </head> <body> <script> // switch语句的用法与变化 var key = 12; switch (key) { case 12: case 1: case 2: document.write("冬季"); break; case 3: case 4: case 5: document.write("春季"); break; case 6: case 7: case 8: document.write("夏季"); break; case 9: case 10: case 11: document.write("秋季"); break; default: document.write("不是地球年"); break; } </script> </body> </html>
js循环
// 循环四要素
/**
* 1、初始值
* 2、表达式
* 3、循环体
* 4、迭代器
*/
// 注意如果没有写迭代器就可能变成死循环，无限循环
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>循环</title> </head> <body> <script> // 循环四要素 /** * 1、初始值 * 2、表达式 * 3、循环体 * 4、迭代器 */ // 注意如果没有写迭代器就可能变成死循环，无限循环 for (var i = 0; i < 10; i++) { //初始值、表达式、迭代器 if (i == 5) { break; //彻底停止循环 // continue; //停止当前循环，进入下次循环 } document.write(i + "~"); //循环体 } // var i = 0; //初始值 // do { // document.write(i, "-"); //循环体 // i++; //迭代器 // } while (i < 10); //表达式 // var i = 0; //初始值 // while (i < 10) { //表达式 // document.write(i + ","); //循环体 // i++; //迭代器 // } </script> </body> </html>
js九九乘法表
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>九九乘法表</title> </head> <body> <script> // 九九乘法表是从1*1————————————9*9的表，故而需要的数据是1-9没有0和10 for (var i = 1; i < 10; i++) { // 由于j和i都是从1开始的，为了添加1*1=1故而需要j<=i，才能有1*1=1 for (var j = 1; j <= i; j++) { // 字符串拼接，由于没有制表符\t故而使用 来代替。 document.write(j + "*" + i + "=" + (i * j) + " "); } // 没行输出完毕则换行。 document.write("<br/>"); } </script> </body> </html>
九九乘法表自己多练练嵌套循环值得了解。
