三种嵌入html方式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>html嵌入js的第一种方式：注册方法</h1> <!-- onclick代表这个input注册了单击方法，当单击时就会触发 window代表了浏览器，alert是弹出对话框方法 通过实践驱动 --> <input type="button" value="hello" onclick="window.alert(‘hello js‘)"/> <h1>html嵌入js的第二种方式：脚本块方式</h1> <script type="text/javascript"> /* * 暴露在脚本块中的程序，在页面打开时执行，从上而下依次执行(不需要事件) * 此时alert会阻塞页面加载直到点击确定 * */ window.alert("hello world"); </script> <h1>html嵌入js的第三种方式：引入独立的js文件</h1> <!--script的结束标签必须有--> <script type="text/javascript" src="001.js"> //这里的代码不会执行 </script> </body> </html>
基础语法：变量，数据类型，函数定义，类定义，类扩展
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <script type=""> // 变量先声明，后使用； // 当变量没有手动赋值时，系统默认赋值undefined var i; // alert("i= "+i); var k=undefined; // 函数不需要指定返回类型，返回什么类型都可以 // function 函数名(形参列表){ // 函数体; // } //不能进行方法重载，后面的方法会抹掉前面的同名方法 function sum(a,b) { // alert(a + b); } //全局变量：浏览器打开时声明，关闭时销毁, //局部变量：函数体中的变量 function myfun() { myname = "zsben"; } // alert("myname="+myname);//如果没有var声明，就是全局变量 // typeof运算符：可以在程序的运行阶段动态获取变量的数据类型 // typeof 变量名 // 运算结果："undefined" "number" "string" "boolean" "object" "function" 这六个小写字符串 // typeof null 的结果是 "object" // 比较字符串是否相等 s1 == s2 function sumplus(a, b){ if(typeof a == "number" && typeof b == "number"){ alert(a+b); } alert(a+","+b+"必须都为数字"); } // Undefined类型只有一个值undefined // 整数 小数 正负数，不是数字(NaN)，无穷大(Infinity)都是Number类 // 10/3=3.333333... // isNaN(a) ：a是否是NaN // parseInt(a)：将字符串自动转换成数字，同时向下取整 // parseFloat()：将字符串转换成数字 // Math.ceil() 向上取整 // Boolean类只有两个值true false // Boolean(a)：将非Boolean类型转换成Boolean类 // a=0,"",null,NaN,undefined 时结果是false // Null 类型只有一个值 null, typeof null == "object" // String 是一种内置类，可以直接用，父类是Object // 字符串 两种创建方式 // 第一种：var s = "abc"; 此时是string // 第二种：var s = new String("abc"); 此时是内置String类,属于Object类型 // 无论小string还是大String，他们的函数都是通用的 // x.length var x = "abc"; var y = new String("abc"); // alert(typeof x); // alert(typeof y); // Object类型：终极超类！ // 属性：prototype:给类动态的扩展属性和函数 // 函数：toString(), valueOf(), toLocalString() // 定义类 // function 类名(形参) { // } // 类名 = function (形参) { // } // 创建对象 // new 构造方法(实参) //构造方法名和类名一致 function sayHello() { // alert("Hello"); } // 把sayHello当成普通函数调用 // sayHello(); //把sayHello当做类来创建对象,obj是一个引用，保存内存地址指向堆中的对象 // var obj = new sayHello(); function User(a,b,c) { //类的定义核构造函数的定义放在一起来完成 this.a=a; this.b=b; this.c=c; } var u1 = new User(111,"zhangsan",30);// 创建对象 Emp = function (ename, sa1) {// 另一种对象创建方式 this.ename = ename; this.sa1 = sa1; //定义函数 this.getEname = function () { return this.ename; } } var e1 = new Emp("Smith", 800); // 可以通过prototype扩展类属性和函数 Emp.prototype.extendvar = "extend"; Emp.prototype.getSa1 = function () { return this.sa1; } // 甚至可以给String扩展一个函数 String.prototype.extendfunc = function () { alert("String的扩展函数") } </script> <!--函数必须调用才能执行--> <input type="button" value="sum(10,20)" onclick="sum(10,20);" /><br/> <!--js函数在调用时参数类型没有限制，并且参数个数也没有限制--> <input type="button" value="sum(20)" onclick="sum(20);" /><br/> <input type="button" value="sum(10,20,30)" onclick="sum(10,20,30);" /><br/> <input type="button" value="myname" onclick="alert(‘myname= ‘+myname)"><br/> <input type="button" value="sumplus(10, 20)" onclick="sumplus(10, 20)"><br/> <input type="button" value="sumplus(10, ‘ab‘)" onclick="sumplus(10, ‘ab‘)"><br/> <!--字符串函数使用--> <input type="button" value="‘abcdefg‘.indexOf(‘c‘)" onclick="alert(‘abcdefg‘.indexOf(‘c‘));"><br/> <input type="button" value="‘abcdefg‘.indexOf(‘h‘)" onclick="alert(‘abcdefg‘.indexOf(‘h‘));"><br/> <input type="button" value="‘a%a%a%aaa‘.replace(‘%‘,‘&‘)" onclick="alert(‘a%a%a%aaa‘.replace(‘%‘,‘&‘));"><br/> <!--substr和substring区别--> <input type="button" value="‘abcdefg‘.substr(2,4)" onclick="alert(‘abcdefg‘.substr(2,4));"><br/> <input type="button" value="‘abcdefg‘.substring(2,4)" onclick="alert(‘abcdefg‘.substring(2,4));"><br/> <!--访问类对象--> <input type="button" value="u1.a" onclick="alert(u1.a)"><br/> <input type="button" value="u1[‘b‘]" onclick="alert(u1[‘b‘])"><br/> <!--扩展类属性/函数--> <input type="button" value="e1.getEname" onclick="alert(e1.getEname())"><br/> <input type="button" value="e1.getSa1" onclick="alert(e1.getSa1())"><br/> <input type="button" value="String.extendfunc" onclick="alert(‘abc‘.extendfunc())"><br/> </body> </html>
原文：https://www.cnblogs.com/zsben991126/p/12693511.html