<h1>结合方式1</h1>
<!DOCTYPE html>
<html>
<head>
<title>01-js结合方式01.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<!-- 結合方式1 -->
<script type="text/javascript">
alert(" haha ");
</script>
</head>
<body>
This is my HTML page. <br>
</body>
</html>
<h1>结合方式2</h1>
<!DOCTYPE html>
<html>
<head>
<title>01-js结合方式01.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<!-- 結合方式2 -->
<script type="text/javascript" src='hello.js'></script>
</head>
<body>
This is my HTML page. <br>
</body>
</html>
<h1>js的基本语法</h1>
二ECMAScript 基础
2.1.ECMAScript 语法
变量区分大小写
a>可一次声明多个变量,并且变量不必具有相同的类型.例如:var test = "hi", age = 25;
b>命名规范:
第一个字符必须是字母、下划线(_)或美元符号($)
余下的字符可以是下划线、美元符号或任何字母或数字字符
c>ECMAScript 的解释程序遇到未声明过的标识符时,用该变量名创建一个全局变量,并将其初始化为指定的值。
这是该语言的便利之处,不过如果不能紧密跟踪变量,这样做也很危险。最好的习惯是像使用其他程序设计语言一样,总是声明所有变量。
变量是弱类型的
每行的分号可有可无.没有就按折行符的末尾作为结尾.
注释与java,c,php相同
使用{}来封装代码块
变量声明不是必须的.
匈牙利类型标记法
在以 Pascal 标记法命名的变量前附加一个小写字母(或小写字母序列),说明该变量的类型。例如,i 表示整数,s 表示字符串,如下所示“
Var iMyTestValue = 0, sMySecondValue = "hi";
数组 a aValues
布尔型 b bFound
浮点型(数字) f fValue
函数 fn fnMethod
整型(数字) i iValue
对象 o oType
正则表达式 re rePattern
字符串 s sValue
变型(可以是任何类型) v vValue
<pre>
<!DOCTYPE html>
<html>
<head>
<title>03-js的语法.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<!-- js是弱类型语言
弱类型一个体现是变量类型可以随时变化的
-->
<script type="text/javascript">
//1声明变量
var a = 1;
a = "haha";
a = false;
//2注释写法与java一样.没哟文档注释
//3申明变量
var b = 2,c=3
//4js中每行语句的结束使用";"号来表示,也可以不是用
//分号
//5声明变量的时候也可不加var 加var和不加var的区别
//加var声明作用范围在代码块中,而不加var声明作用范围在全局
//6字母大小写,语法区分大小写 语法上FUNCTION区分大小写
function fun1(){
var d ="hello"
e = "heihei";
}
fun1();
//alert(d); //作用范围在方法那个代码块里
alert(e);//e作用范围在全局
</script>
</head>
<body>
This is my HTML page.
</body>
</html>
</pre>
<h1>js的变量</h1>
<pre>
<!DOCTYPE html>
<html>
<head>
<title>01-js结合方式01.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<!-- 結合方式2 -->
<script type="text/javascript">
//java中的变量分类
//1基本数据类型
//2引用数据类型
//js中的变量分类
//1原始类型
//2对象类型
//---------------------------
//js的原始类型 5种
//1 number(长度相当于java的long 不区分整形和浮点型)
//2 string(基本数据类型)
//3 boolean 布尔
//4 null 一般人为赋值null.(java会自动赋值为null) 当我们想给这个对象将来装引用数据类型的时候
//我们会赋值为null 也就是对象类型的占位符
//5 undefined(未定义) null的衍生值 系统自动赋值的 当我们创建一个变量并且没有初始化的时候
var a = 10;
var b = 3.14;
//单引号和双引号都是字符串类型
var c ="hello";
var d = 'word';
var e = true;
var f = null;
var g = undefined;
//以下没赋值会自动赋值为undefined
var h;
var i = new Object();
//运算符=>typeof=>返回原始类型的类型
/* alert(typeof a);
alert(typeof b);
alert(typeof c);
alert(typeof d);
alert(typeof e);
alert(typeof f);
//typeof null =>这里为object
//是javascript中的一个bug 后来保留了该bug
alert(typeof g);
alert(typeof h); */
alert(typeof i);
</script>
</head>
<body>
This is my HTML page.
</body>
</html>
</pre>
<h1>js中的语句</h1>
<pre>
<!DOCTYPE html>
<html>
<head>
<title>05-js的语句.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<!-- js的语句 -->
```
<script type="text/javascript">
//java中的语句
//循环 for while do do while
//判断 if else switch
//js和java中是一样的
function fun1(){
var num1 = 1;
var num2 = 2;
if(num1<num2){
alert("num1");
}else{
alert("num2");
}
}
fun1();
function fun2(){
var count = 0;
for(i = 1;i<100;i++){
count+=i;
}
alert(count);
}
fun2();
</script>
```
</head>
<body>
This is my HTML page.
</body>
</html>
</pre>
<h1>js中的运算符 一元运算符</h1>
<pre>
<!DOCTYPE html>
<html>
<head>
<title>05-js的语句.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<!-- js的语句 -->
<script type="text/javascript">
//java中的运算符
var a = -2;
var a =+2;
var c ="1234";
alert(typeof c);
c = -c;
alert(typeof c);
//js是弱类型=>js是类型会根据需要自动变化
//上面的例子中因为+是数学运算符,所以需要c是数字类型,js就会自动将c转换为number类型
//-号仅仅能够转化可是符号位会变化不建议用
</script>
</head>
<body>
This is my HTML page.
</body>
</html>
</pre>
<h1>js中的运算符-BOOLEAN运算符
<pre>
<!DOCTYPE html>
<html>
<head>
<title>05-js的语句.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<!-- js的语句 -->
<script type="text/javascript">
//js中的运算符
//&&||!=>与java的一模一样
//-------------------------
//js会在需要上面类型时,对类型自动转换
if(""){
alert("true");
}else{
alert("false");
}
if(1){
alert("true");
}else{
alert("false");
}
//Object =>boolean true
//undefined =>boolean false
//null =>boolean null的结果为false
//string =>boolean 字符串不为空串其他都是true
//number =>除了+0和-0 NaN其他都是true
//NaN是number里的一个特殊值用来表示错误的数字
//上面是错误的数字
var n = +"abc";//这种情况下n的值就是NaN
//NaN的全写就是not a number
if(NaN){
alert("1true");
}else{
alert("1false");
}
if("haha"&&null){
alert("1true");
}else{
alert("1false");
}
if("haha"&&1){
alert("1true");
}else{
alert("1false");
}
</script>
</head>
<body>
This is my HTML page.
</body>
</html>
</pre>
<h1>06-js中的运算符-一元运算符.html</h1>
<pre>
<!DOCTYPE html>
<html>
<head>
<title>js中的三元运算符.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<!-- js的语句 -->
<script type="text/javascript">
var a = 10;
var b = 20;
alert(a>b?"a":"b");
var c = 1;
c+=1;
alert(a);//2
var d = 1;
d+="1";
alert=(d)//11
//如果是乘除莫会把字符串转化为数字
</script>
</head>
<body>
This is my HTML page.
</body>
</html>
</pre>
<h1>07-js中的运算符-BOOLEAN运算符.html</h1>
<pre>
<!DOCTYPE html>
<html>
<head>
<title>05-js的语句.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<!-- js的语句 -->
<script type="text/javascript">
//js中的运算符
//&&||!=>与java的一模一样
//-------------------------
//js会在需要上面类型时,对类型自动转换
if(""){
alert("true");
}else{
alert("false");
}
if(1){
alert("true");
}else{
alert("false");
}
//Object =>boolean true
//undefined =>boolean false
//null =>boolean null的结果为false
//string =>boolean 字符串不为空串其他都是true
//number =>除了+0和-0 NaN其他都是true
//NaN是number里的一个特殊值用来表示错误的数字
//上面是错误的数字
var n = +"abc";//这种情况下n的值就是NaN
//NaN的全写就是not a number
if(NaN){
alert("1true");
}else{
alert("1false");
}
if("haha"&&null){
alert("1true");
}else{
alert("1false");
}
if("haha"&&1){
alert("1true");
}else{
alert("1false");
}
</script>
</head>
<body>
This is my HTML page.
</body>
</html>
</pre>
<h1>08-js中的运算符-数字运算符.html</h1>
<pre>
<!DOCTYPE html>
<html>
<head>
<title>05-js的语句.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<!-- js的语句 -->
<script type="text/javascript">
//js中的运算符
//使用+法时,如果相加的值包含字符串,会自动转化为字符串类型
var a = "1"+1;
alert(a);//11
//其他数学运算符中,字符串会自动转换为数字
var b ="2"-1;
alert(b);//1
</script>
</head>
<body>
This is my HTML page.
</body>
</html>
</pre>
<h1>09-js中的运算符-关系运算符.html</h1>
<pre>
<!DOCTYPE html>
<html>
<head>
<title>js中的关系运算符.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<!-- js的语句 -->
<script type="text/javascript">
//js中的关系运算符
//alert("2">1); //true
//alert('a'>'b') false
//alert("aa">"ab"); false
//alert("2">"1");字符串的比较规则=>asc码的比对true
</script>
</head>
<body>
This is my HTML page.
</body>
</html>
</pre>
<h1>10-js中的运算符-等性运算符.html</h1>
<pre>
<!DOCTYPE html>
<html>
<head>
<title>js中的关系运算符.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<!-- js的语句 -->
<script type="text/javascript">
//js中的等性运算符
//== != ===
alert(1==true);//true 这里因为true转化后为1 1==1
alert(2==true); //false 这里是 2==1所以false
alert(0==false);//true
alert(0==null);//false null不能转化为数字就是nan 0!=NAN
alert(null==undefined)//true 衍生为true
alert(NaN==NaN);//false 存在NaN除去非和!=其他都是false
//----------------------------------
//===比较时包括类型本身
alert(1===true);//false
alert("1"===1);//false
</script>
</head>
<body>
This is my HTML page.
</body>
</html>
</pre>
<h1>11-js中的运算符-三元运算符.html</h1>
<pre>
<!DOCTYPE html>
<html>
<head>
<title>js中的三元运算符.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta name="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<!-- js的语句 -->
<script type="text/javascript">
var a = 10;
var b = 20;
alert(a>b?"a":"b");
var c = 1;
c+=1;
alert(a);//2
var d = 1;
d+="1";
alert=(d)//11
//如果是乘除莫会把字符串转化为数字
</script>
</head>
<body>
This is my HTML page.
</body>
</html>
</pre>