前言:逻辑思维和思路很重要
————————————————————————————————————————————————
一、JavaScript的概述
javascript 具有人机交互性,javascript 是一种逻辑性语言,具有判断能力。(HTML、CSS是表现型语言)。
javascript 跨平台 ,客户端的脚本语言,面向对象的 ,<img>对象 <div>对象
跨平台:在不同的操作系统上都可以运行
客户端脚本语言:不用安装服务器环境
面向对象 :对象有各种各样的,<img>对象,定义好了,直接用,在js中把HTML的标签也当做对象,万物皆对象。
二、JS的引入
第一种:
<script type=”text/javascript”>
js代码
</script>
第二种:
<script src=”XX.js”></script>
其中,JS代码可以放入到html的任何位置,一般情况下,放在<head></head>中
三、JS的注释
html的注释:<!--注释内容-->
CSS注释:/*注释内容*/
js注释:
//单行注释
/*多行注释*/
四、在js中输出内容的两种方法
第一种:document.write(内容)
- document: 表示文档对象,整个网页,指的是<body></boby>中的内容
- .:表示文档对象的一个方法,也就是调用文档对象的一个方法。
- write: 输出的方法
- 内容:就是输出的内容,网页输出的内容。
第二种:window.alert(内容)---在窗口弹出一个对话框
window代表的事窗口对象
.代表的是一个方法
alert()弹出一个对话框的方法
例子:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />//设置文档类型和字符编码
<title>js中的两种输出内容的方法</title>
<script type="text/javascript">
window.alert("周杰伦的歌好听吗?");//首先执行弹框的输出内容
document.write("周杰伦的歌很好听");//其次执行本行的内容
</script>
</head>
<body>
</body>
</html>
截图效果:
单机确定后,出现以下截图;
so,可以总结出,通过alert()可以停止在alert()后边需要执行的代码。
五、变量
变量是用来存储数据的,计算机的内存就是用来存储数据的;
变量的特点:
变量可以反复存储数据,可以反复取出数据,可以更改数据。
变量声明:
语法:var 变量名 = 值;
其中var 是关键字,是用来声明变量用的。
变量的声明规则:
1.变量可以自定义,开头是字母或者下划线,后跟字母,数字和下划线
2.在js中变量名是区分大小写的。所有的变量名都得是英文下书写。
3.命名要见名知意:
驼峰法:开头的第一个单词,小写,其他单词的首字母都大写。
如:getElemetById
下划线法:user_name_mail
提示:变量的数据类型是由变量的值来决定的。
六、变量的数据类型
测试数据的类型用:typeof()
在js中数据类型分为:
基本数据类型:数值型(number)、字符串型(string)、布尔型(boolean)、空型(null)、未定义型(undefined)
复杂数据类型:对象(object)、数组(array)、函数(function)
基本数据类型详解:
1.数值型
小例子:
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
5 <title></title>
6 <script type="text/javascript">
7 var a = 30;
8 var b = 50;
9 var c = a + b;
10 document.write(c);//提示:变量输出的时候不需要加引号
11 </script>
12 </head>
13 <body>
14
15 </body>
16 </html>
2.字符串类型:用双引号和单引号引起来的,字母,汉字,特殊字符,还有html标签等。
3.布尔值:只有两个值,true和false
4.null空类型 它的数据类型是对象
5.undefined 只设置了变量但是没有给赋值
复合数据类型详解;
1.对象 object
var obj = {name:"周杰伦",age:28,sex:女};
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title></title>
<script type="text/javascript">
var obj = {name:"周杰伦",age:28,sex:"女"};
obj.name = "昆凌";//对象的赋值
var a = obj.name;//对象的使用
document.write(a);
document.write("<br>");
document.write(typeof(obj));
</script>
</head>
<body>
</body>
</html>
2.数组
var array[22,12,3,55];
总结:都是一些最基本的常识。