1、简单示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>网页的标题</title>
<!--script标签的位置随意 -->
<script type="text/javascript">
document.write("<h1>利用js的方式动态写入内容</h1>")
</script>
</head>
<body>
</body>
</html>
2、基本数据类型
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>网页的标题</title>
<!--script标签的位置随意 -->
<script type="text/javascript">
document.writeln("<h1>利用js的方式动态写入内容</h1>")
var a
document.writeln(typeof a)
var a=0
document.writeln(typeof(a))
var a="abc"
document.writeln(typeof a)
var a='a'
document.writeln(typeof a)
var a=1.12
document.writeln(typeof a)
var a=true
document.writeln(typeof a)
var a=null
document.writeln(typeof a)
</script>
</head>
<body>
</body>
</html>
网页显示：
image.png
一般在调试打印日志的时候用的更多的是
console.log()
示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>网页的标题</title>
<!--script标签的位置随意 -->
<script type="text/javascript">
var a
console.log(typeof a)
var a=0
console.log(typeof a)
var a="abc"
console.log(typeof a)
</script>
</head>
<body>
</body>
</html>
然后在浏览器的开发者选项中，console选项卡中
image.png
3、一点注意事项
NaN：not a number如果两个数据类型都是NaN，这两个数据类型也不相等
4、等性运算符
==、!=、===、!==
官方手册：http://www.w3school.com.cn/js/pro_js_operators_equality.asp
在 ECMAScript 中，等号由双等号（==）表示，当且仅当两个运算数相等时，它返回 true。非等号由感叹号加等号（!=）表示，当且仅当两个运算数不相等时，它返回 true。为确定两个运算数是否相等，这两个运算符都会进行类型转换。
执行类型转换的规则如下：
-
如果一个运算数是 Boolean 值，在检查相等性之前，把它转换成数字值。false 转换成 0，true 为 1。
-
如果一个运算数是字符串，另一个是数字，在检查相等性之前，要尝试把字符串转换成数字。
-
如果一个运算数是对象，另一个是字符串，在检查相等性之前，要尝试把对象转换成字符串。
-
如果一个运算数是对象，另一个是数字，在检查相等性之前，要尝试把对象转换成数字。
在比较时，该运算符还遵守下列规则： -
值 null 和 undefined 相等。
-
在检查相等性时，不能把 null 和 undefined 转换成其他值。
-
如果某个运算数是 NaN，等号将返回 false，非等号将返回 true。
-
如果两个运算数都是对象，那么比较的是它们的引用值。如果两个运算数指向同一对象，那么等号返回 true，否则两个运算数不等。
重要提示：即使两个数都是 NaN，等号仍然返回 false，因为根据规则，NaN 不等于 NaN。
image.png
等号和非等号的同类运算符是全等号和非全等号。这两个运算符所做的与等号和非等号相同，只是它们在检查相等性前，不执行类型转换。
全等号由三个等号表示（===），只有在无需类型转换运算数就相等的情况下，才返回 true。
例如：
var sNum = "66";
var iNum = 66;
alert(sNum == iNum); //输出 true
alert(sNum === iNum); //输出 false
在这段代码中，第一个 alert 使用等号来比较字符串 "66" 和数字 66，输出 "true"。如前所述，这是因为字符串 "66" 将被转换成数字 66，，然后才与另一个数字 66 进行比较。第二个 alert 使用全等号在没有类型转换的情况下比较字符串和数字，当然，字符串不等于数字，所以输出 "false"。
非全等号由感叹号加两个等号（!==）表示，只有在无需类型转换运算数不相等的情况下，才返回 true。
例如：
var sNum = "66";
var iNum = 66;
alert(sNum != iNum); //输出 false
alert(sNum !== iNum); //输出 true
这里，第一个 alert 使用非等号，把字符串 "66" 转换成数字 66，使得它与第二个运算数 66 相等。因此，计算结果为 "false"，因为两个运算数是相等的。第二个 alert 使用的非全等号。该运算是在问："sNum" 与 "iNum" 不同吗？这个问题的答案是：是的（true），因为 sNum 是字符串，而 iNum 是数字，它们当然不同。
5、switch语句
在 ECMAScript 中，switch 语句可以用于字符串，而且能用不是常量的值说明情况：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>网页的标题</title>
<!--script标签的位置随意 -->
<script type="text/javascript">
var BLUE = "blue",
RED = "red",
GREEN = "green";
var sColor="red"
switch(sColor) {
case BLUE:
alert("Blue");
break;
case RED:
alert("Red");
break;
case GREEN:
alert("Green");
break;
default:
alert("Other");
}
</script>
</head>
<body>
</body>
</html>
网页显示：
image.png
6、函数
函数定义关键字function，在函数定义中，不管函数有没有返回值，都不用写返回值类型
7、给按钮绷定函数
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>网页的标题</title>
<!--script标签的位置随意 -->
<script type="text/javascript">
function showText() {
document.write("HelloWorld")
}
</script>
</head>
<body>
<input type="button" value="点击" onclick="showText()" />
</body>
</html>
8、数组
javascript中数组的长度是可变的
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>网页的标题</title>
<!--script标签的位置随意 -->
<script type="text/javascript">
new Array();
new Array(3);
var arr=new Array("a", 20, true);
document.write(arr[2])
</script>
</head>
<body>
</body>
</html>
9、正则表达式
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>网页的标题</title>
<!--script标签的位置随意 -->
<script type="text/javascript">
//检验手机号合法性：要求必须是11位，第一位必须是1，第二位不能是0、1、2剩余位数随意
var reg=new RegExp("^1[^012]\\d{9}$");
var mobile="13260289173"
alert(reg.test(mobile))
</script>
</head>
<body>
</body>
</html>
10、日期
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>网页的标题</title>
<!--script标签的位置随意 -->
<script type="text/javascript">
var date=new Date();
alert(date.getFullYear())
</script>
</head>
<body>
</body>
</html>
显示结果：
image.png
网友评论