JavaScript快速入门

因为需要使用JS,所以想快速入门。。。

因为之前学过Python,C++,Java等几种语言,所以这篇快速入门并不适合纯初学者,请见谅。

JavaScript主要有两种用法:

嵌在网页中,使用<script>和</script>包起来,可以放置在<head> 部分或<body>部分。单独使用一个js文件。注意,JS如果要操作html的元素,其元素必须在JS代码之前。

要点

JavaScript 有多种数据类型:数字,字符串,数组,对象等等.变量是用于存储信息的"容器"。Undefined 这个值表示变量不含有值。JavaScript 变量的生命期从它们被声明的时间开始。局部变量会在函数运行以后被删除。全局变量会在页面关闭后被删除。在 HTML 中, 全局变量是 window 对象: 所有数据变量都属于 window 对象。

下面是一些代码示例,主要展示嵌html的JS代码。

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <p id="demo" > First </p> <button id="fbi">Hello</button> <button id="haha">changetime</button> <script> function multiply(a,b){ return a * b; } function LoadTime(){ return document.getElementById("demo").innerHTML = Date(); } var print = new Function("a" , "b" , "return a*b;");//函数是个对象,通过这种方式定义一个新的函数。函数是对象。但是在 JavaScript 中,很多时候,你需要避免使用new关键字。 document.write("<h1>这是一个标题</h1>"); document.write("<p>这是一个段落</p>");//写信息 window.alert("warning FBI!");//弹出警告框来显示数据 document.getElementById("demo").innerHTML = "HAHA!";//使用 document.getElementById(id) 方法从 JavaScript 访问某个 HTML 元素 document.write(Date());//使用 document.write() 方法将内容写到 HTML 文档中,如果文档加载完成,内容会被覆盖。 console.log("Hello World!");//写入到浏览器的控制台 document.getElementById("demo").innerHTML = "3 *4 = " + multiply(3,4);//更改id为demo的值 var ab = 10; var ab;//如果重新声明 JavaScript 变量,该变量的值不会丢失。 document.getElementById("demo").innerHTML = "ab = " + ab;//更改id为demo的值 var str = "String"; var str = 123456789; window.alert(str);//输出警告信息 str = null;//可以通过将变量的值设置为 null 来清空变量。 LOOP: { for (let i=0;i<10;i++){//在 ES6 中,提供了 let 关键字和 const 关键字。let 的声明方式与 var 相同,用 let 来代替 var 来声明变量,就可以把变量限制在当前代码块中。 document.write(i + "<br>"); if (i == 6) break;//退出LOOP所标记的代码段。 } } document.write(typeof ""); document.write(Date().constructor);//输出构造函数 document.write("<br>"); var ten = "10";//JavaScript 拥有动态类型。这意味着相同的变量可用作不同的类型。 var ten = + ten;//转化为数字,Operator +可用于将变量转换为数字。 document.write(typeof ten);//输出变量类型 document.write( "<br>" + "123456789".search("56") );//检索 document.write( "<br>" + "123456789".replace(/56/i , "ab") );//正则表达式 var text = JSON.parse( { "example":"123" } );//解析JSON document.write("<br>" + text); document.write( "<br>" + print(8,9) );//自动转换类型。 for (var i = 0; i<100;i++){ document.write("<br>");//输出换行符 } host();//提升 function host(){ document.write("<br>" + "hosting"); } ( function () { document.write( "<br>" + "匿名函数" ) } )();//匿名函数 document.write( typeof host + " " + host.toString() );//输出函数原始代码 function sum(){ var s = 0 ; for (var i=0;i<arguments.length;i++){ s += arguments[i]; } return s; } document.write( "<br> sum = " + ( sum(1,2,3,4,5,6,7,8,9) ) );//参数过多,使用数罪 function non(){ return this; } 1 === 2 ? 1 : 2;//Javascript三目运算(三元运算) 语句。 //document.wriet( "<br>" + non ); demo = 10 var demo;//在 JavaScript 中,可以在使用变量之后对其进行声明。换句话说,可以在声明变量之前使用它。 var obj = { x : 123 , xgb : function(){ document.write("<br>---------------obj-------------------<br>"); } } obj.xgb();//对象的方法 document.getElementById("haha").onclick = function () {LoadTime()};//添加事件 document.getElementById("fbi").addEventListener("click" , function(){alert("Hello world!")});//添加事件 </script> <button onclick = "LoadTime()">Time</button> <a href="javascript:void(0);">点我没有反应的!</a>void 是 JavaScript 中非常重要的关键字,该操作符指定要计算一个表达式但是不返回值。 <a href="#top">点我定位到指定位置!</a> <br><br><br> <p id="pos">尾部定位点</p> </body> </html>

另外代码有些乱,之后有时间可能会整理,抱歉。