JavaScript简介及用法（一）
2018-01-12 09:29
399 查看
JavaScript是Web的编程语言。所有现代的Html页面都使用JavaScript。
我们为什么要学习JavaScript呢？
1、Html定义了网页的内容；
2、CSS描述网页的布局；
3、JavaScript网页的行为，即事件的响应。
JavaScript是脚本语言，轻量级，可插入Html页面的编程代码。
eg1: 直接写入Html输出流<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<p>下面写入的是JavaScript输出流语句</p>
<script>document.write("<h1>这是用JavaScript语法写入的输出流</h1>")</script>
</body>
</html>上面是一个简单的JavaScript写入Html输出流的例子。接下来我们从简单到复杂的一起学习JavaScript语言。
HTML中的脚本必须位于<script></script>标签之间。脚本可放置在HTML页面的<body>和<head>部分中。您可以在
HTML文档中放入不限数量的脚本。脚本可同时存在于<body><head>两个部分中，通常的做法是把函数放入<head>部分中，
或者放在页面底部，这样就可以把他们安置到同一处位置，不会干扰到页面的内容。
eg2:<head>中的JavaScript函数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
function changeContent() {
document.getElementById("demo").innerHTML="我的第一个JavaScript函数";
}
</script>
</head>
<body>
<h1>这是一个WEB页面</h1>
<p id="demo">这是一个段落，一会要修改内容的！</p>
<button onclick="changeContent()">点击此按钮修改上面段落内容</button>
</body>
</html> 上面的例子我们把JavaScript函数放置到HTML页面的<head>部分，当然也可以放置在<body>部分，效果是一样的，大家可以自己测试一下。
上述例子我们都是把脚本放置在HTML页面中，我们也可以把脚本保存到外部文件中，外部文件可以包含多个网页使用的代码，外部JavaScript文件的扩展名是.js。如需使用外部文件，请在<script>标签的"src"属性中设置该.js文件。
使用外部.js文件实现上述效果：<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="..\js\javascript.js">
</script>
</head>
<body>
<h1>这是一个WEB页面</h1>
<p id="demo">这是一个段落，一会要修改内容的！</p>
<button onclick="changeContent()">点击此按钮修改上面段落内容</button>
</body>
</html>
以上是关于JavaScript的简单介绍，及简单的脚本使用方法，由于本人也是刚刚学习JavaScript语法，如有不对的地方请大家指正，希望和大家一起共同进步，学好JS。
我们为什么要学习JavaScript呢？
1、Html定义了网页的内容；
2、CSS描述网页的布局；
3、JavaScript网页的行为，即事件的响应。
JavaScript是脚本语言，轻量级，可插入Html页面的编程代码。
eg1: 直接写入Html输出流<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<p>下面写入的是JavaScript输出流语句</p>
<script>document.write("<h1>这是用JavaScript语法写入的输出流</h1>")</script>
</body>
</html>上面是一个简单的JavaScript写入Html输出流的例子。接下来我们从简单到复杂的一起学习JavaScript语言。
HTML中的脚本必须位于<script></script>标签之间。脚本可放置在HTML页面的<body>和<head>部分中。您可以在
HTML文档中放入不限数量的脚本。脚本可同时存在于<body><head>两个部分中，通常的做法是把函数放入<head>部分中，
或者放在页面底部，这样就可以把他们安置到同一处位置，不会干扰到页面的内容。
eg2:<head>中的JavaScript函数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
function changeContent() {
document.getElementById("demo").innerHTML="我的第一个JavaScript函数";
}
</script>
</head>
<body>
<h1>这是一个WEB页面</h1>
<p id="demo">这是一个段落，一会要修改内容的！</p>
<button onclick="changeContent()">点击此按钮修改上面段落内容</button>
</body>
</html> 上面的例子我们把JavaScript函数放置到HTML页面的<head>部分，当然也可以放置在<body>部分，效果是一样的，大家可以自己测试一下。
上述例子我们都是把脚本放置在HTML页面中，我们也可以把脚本保存到外部文件中，外部文件可以包含多个网页使用的代码，外部JavaScript文件的扩展名是.js。如需使用外部文件，请在<script>标签的"src"属性中设置该.js文件。
使用外部.js文件实现上述效果：<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="..\js\javascript.js">
</script>
</head>
<body>
<h1>这是一个WEB页面</h1>
<p id="demo">这是一个段落，一会要修改内容的！</p>
<button onclick="changeContent()">点击此按钮修改上面段落内容</button>
</body>
</html>
function changeContent() {
document.getElementById("demo").innerHTML="使用外部.js脚本修改段落内容"
}<script src="..\js\javascript.js">//..是指上一层目录注意：外部脚本不能包含<script>标签。
以上是关于JavaScript的简单介绍，及简单的脚本使用方法，由于本人也是刚刚学习JavaScript语法，如有不对的地方请大家指正，希望和大家一起共同进步，学好JS。
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 【优波尔】JavaScript的笔记 (1) 简介 用法 输出 语法
- JavaScript简介及用法（二）
- JavaScript简单学习（lecture 1）教程、简介、用法
- javascript事件, 解决mousedown和click冲突事件, 鼠标事件, 键盘事件, 文本事件用法简介
- Javascript中showModalDialog以及open用法简介
- javascript中sort()的用法实例分析
- javascript中call()和apply()的用法及区别详解
- MongoDB中javascript脚本编程简介和入门实例
- javascript:void(0)的用法讲解
- Javascript中eval函数的详细用法与说明
- JavaScript中匿名函数用法实例
- javascript的this用法
- Android中Toast的用法简介
- JavaScript 用法
- sql loader的用法简介
- JSON简介以及用法汇总
- Javascript常用函数及基本教程集合的用法参考
- Javascript模块化编程（三）：require.js的用法
- elicpse中的source和refactor的用法简介
- JavaScript简介