首页 > 代码库 > JS的第一天

JS的第一天

2024-08-28 03:13:56   219人阅读

JavaScript

一个完整的网页，分为三个部分组成：

HTML：网页架构和内容

CSS：网页的样式

JavaScript：网页的行为

 

Java在网页中，有三种写法：

第一种：直接在HTML标签里面写

<a href=http://www.mamicode.com/"javascript:alert(111)">超链接点击</a>
<h4 onclick="javascript:alert(111)">文本点击</h4>

第二种：<script>标签可以写在  head body 里面 html 外面

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>我的第一个js</title>
    <script>
        alert("JavaScript第一次被运行");
    </script>
</head>
<body>
   <a href=http://www.mamicode.com/"javascript:alert(111)">超链接点击</a>
   <h4 onclick="javascript:alert(111)">文本点击</h4>
   <script>
       alert("JavaScript第二次被运行");
   </script>
</body>
</html>
<script>
    alert("JavaScript最后一次次被运行");
</script>

 

第三种：使用外部文件引入的方式：

         首先 新建一个js文件  demo.js 记住：所以外部JavaScript文件的后缀  .js

         在网页中引入js代码

<script src="http://www.mamicode.com/demo.js"></script>

 

 

JavaScript数据类型：Javascript是一个弱语言，在使用的时候确定是什么类型；

         String，number，boolean，Array，Object，null 

如何看你的变量是什么类型，使用  typeof  关键字

我们以前没有见过的类型  undefined  未定义的类型，表明你这个变量没有被初始化或使用。

 

数据类型的转换：

数值类型转换成字符串

453+””;  453.toString();

 

字符类型转换为数值

parseInt转换的时候 小数点位置不保留

parseInt(str);

 

parseFloat转换的时候   小数点位置是保留的

var num1= parseFloat(str)

 

 

JavaScript注释：

//  /*    */    <!--  -->

 

Javascript常用的输入输出方式：

Alert()  弹窗输出。

confirm("你确定你是男的？")  选择弹窗，返回 boolean值

var flag = confirm("你确定你是男的？");

 

输入弹窗  prompt();

var input = prompt("你输入你的年龄：");

 

当然，我们在输入的时候不知道我输入的是字符还是数字

使用  isNaN(变量) 这个方法是判断它不是数值的（is not a number）  如果是返回false  不是其他返回 true 

 

 

 

运算符

算数运算符

运算符

描述

例子

结果

+

加

x=y+2

x=7

-

减

x=y-2

x=3

*

乘

x=y*2

x=10

/

除

x=y/2

x=2.5

%

求余数 (保留整数)

x=y%2

x=1

++

累加

x=++y

x=6

--

递减

x=--y

x=4

 

赋值运算符

运算符

例子

等价于

结果

=

x=y


x=5

+=

x+=y

x=x+y

x=15

-=

x-=y

x=x-y

x=5

*=

x*=y

x=x*y

x=50

/=

x/=y

x=x/y

x=2

%=

x%=y

x=x%y

x=0

 

 

逻辑运算符

运算符

描述

例子

&&

and

(x < 10 && y > 1) 为 true

||

or

(x==5 || y==5) 为 false

!

not

!(x==y) 为 true

 

 

比较运算符

运算符

描述

例子

==

等于

x==8 为 false

===

全等（值和类型）

x===5 为 true；x==="5" 为 false

!=

不等于

x!=8 为 true

> 

大于

x>8 为 false

< 

小于

x<8 为 true

>=

大于或等于

x>=8 为 false

<=

小于或等于

x<=8 为 true

 

 

控制语句

If()语句

if(input > 18){
    alert("恭喜你，成年了");
}else{
    alert("小屁孩，一边玩去");
}

 

switch

switch(input){
    case  1:
        break;
    default :
        
}

 

for

for(var i = 0;i < 5; i++){

}

 

 while 循环语句

while(true){

}

 

 

DOM初步接触

Document Object Model(文档对象模型)

 

使用write方法输出Html标签+CSS样式

 

document.write("<h1>Hello J18</h1>");

 


JS的第一天


联系
我们