加载JavaScript
类似于加载css,可以参考此文章:HTML学习笔记:加载css
在页面内加载
- 此方式仅适用简单静态页面的展示,工程性文档还请加载外部js,便于维护调试。
在<head>中加载
- 写好HTML代码后,在<head>和</head>直接添加js代码。
- 在头部这样添加:<style type="text/javascript">(这里写js代码)</style>
示例test.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>测试js</title>
<script type="text/javascript">
function welcome() {
var visitor_name;
visitor_name = prompt(" 请输入你的姓名:");
document.write("<h3>Hello "+visitor_name+" Welcome!</h3>");
}
</script>
</head>
<body>
<center>
<h1>Welcome to rumosky.com!</h1>
<script type="text/javascript">welcome();</script>
<p>I love rumosky.com!</p>
<hr>
<p>Copyright © 2018 <a href="https://www.rumosky.com" target="_blank">如默星空</a> All Rights Reserved</p>
</center>
</body>
</html>
在<body>中加载
- 写好HTML代码后,在<body>和</body>直接添加js代码。
- 在头部这样添加:<style type="text/javascript">(这里写js代码)</style>
示例test.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>测试js</title>
</head>
<body>
<center>
<h1>Welcome to rumosky.com!</h1>
<script type="text/javascript">
function welcome() {
var visitor_name;
visitor_name = prompt(" 请输入你的姓名:");
document.write("<h3>Hello "+visitor_name+" Welcome!</h3>");}
welcome();
</script>
<p>I love rumosky.com!</p>
<hr>
<p>Copyright © 2018 <a href="https://www.rumosky.com" target="_blank">如默星空</a> All Rights Reserved</p>
</center>
</body>
</html>
加载外部JavaScript文件
- 将js代码写好保存为xxx.js
- 写好HTML代码后,在<head>和</head>直接添加<style type="text/javascript" src="xxx.js"></style>
- src=""引号之内的是js文件的路径
示例test.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>测试js</title>
<script type="text/javascript" src="function.js"></script>
</head>
<body>
<center>
<h1>Welcome to rumosky.com!</h1>
<script type="text/javascript">welcome();</script>
<p>I love rumosky.com!</p>
<hr>
<p>Copyright © 2018 <a href="https://www.rumosky.com" target="_blank">如默星空</a> All Rights Reserved</p>
</center>
</body>
</html>
function.js
function welcome() {
var visitor_name;
visitor_name = prompt(" 请输入你的姓名:");
document.write("<h3>Hello "+visitor_name+" Welcome!</h3>");
}
版权声明:本站未注明转载的文章均为原创,版权归 如默 所有
本文链接:https://www.rumosky.com/archives/73.html
所有转载文章须注明出处,保留原作者链接,并说明文章非原创,且不可用于商业目的
博主写的挺良心的,必须给个赞。好评!φ( ̄∇ ̄o)
(☆ω☆)