您的位置:首页 > Web前端 > JavaScript

javascript hello world

2017-07-13 17:48 309 查看
JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为javascript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。


1、基本特点

JavaScript是一种属于网络的脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果。通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。
是一种解释性脚本语言(代码不进行预编译)。
主要用来向HTML(标准通用标记语言下的一个应用)页面添加交互行为。
可以直接嵌入HTML页面,但写成单独的js文件有利于结构和行为的分离。
跨平台特性,在绝大多数浏览器的支持下,可以在多种平台下运行(如Windows、Linux、Mac、Android、iOS等)

Javascript脚本语言同其他语言一样,有它自身的基本数据类型,表达式和算术运算符及程序的基本程序框架。Javascript提供了四种基本的数据类型和两种特殊数据类型用来处理数据和文字。而变量提供存放信息的地方,表达式则可以完成较复杂的信息处理。


2、日常用途

javascript为网页添加各式各样的动态功能,当我们使用javascript编码的时候,我们可以完成以下动作: 

- 嵌入动态文本于HTML页面。 

- 对浏览器事件做出响应。 

- 读写HTML元素。 

- 在数据被提交到服务器之前验证数据。 

- 检测访客的浏览器信息。 

- 控制cookies,包括创建和修改等 

- 基于Node.js技术进行服务器端编程。


3、Hello World


3.1 不分模块的Js

使用内嵌的方式,把js添加到html代码中,可以把js代码添加到head元素里面,也可以js代码添加到body元素中。它们的区别是:在HTML
body部分中的JavaScripts会在页面加载的时候被执行。在HTML head部分中的JavaScripts会在被调用的时候才执行。

first.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<script type="text/javascript">
function myClick(){
alert('hello world');
}
</script>
<title>first js</title>
</head>
<body>
<input type="button" value="我是一个按键" onclick="myClick();" />
<br />
<br />
<input type="button" value="我是另一个按键" id="btn" / >
<script type="text/javascript">
onload = function (){
document.getElementById("btn").onclick=function (){
alert("hello world");
}
}
</script>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25


3.2 引入型的Js

把js代码抽离出html代码,实现代码的分离。当我们需要修改js代码的时候就可以更新相关的js代码即可。不需要修改html代码。

first.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<script type="text/javascript" src="js/demo.js"></script>
<title>first js</title>
</head>
<body>
<input type="button" value="我是一个按键" onclick="myClick();" />
<br />
<br />
<input type="button" value="我是另一个按键" id="btn" / >
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
1
2
3
4
5
6
7
8
9
10
11
12
13
14

2.first.js

function myClick(){
alert('hello world');
}

onload = function (){
document.getElementById("btn").onclick=function (){
alert("hello world");
}
}
1
2
3
4
5
6
7
8
9
1
2
3
4
5
6
7
8
9

当然你也可以在html中的head元素或者body元素中引入Js的引用。

本来转载自:IT摆渡网--一个IT实时问答系统--快速解决你的任何IT问题,无需等待!---www.itbaiduwang.com
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: