作为web的编程语言，javascript的重要性也是不言而喻了，那么你也想入门学习一下吗?如果是的话，就跟小编一起来看看它的简单教程吧。
基础的JavaScript实例：
1.用JavaScript输出文本
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程</title> </head> <body> <h1>我的第一个 Web 页面</h1> <p>我的第一个段落。</p> <script> document.write(Date()); </script> </body> </html>
2.用JavaScript改变HTML元素
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<h1>我的第一个 Web 页面</h1>
<p id="demo">我的第一个段落。</p>
<script>
document.getElementById("demo").innerHTML="段落已修改。";
</script>
</body>
</html>一个外部JavaScript
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程</title> </head> <body> <h1>我的 Web 页面</h1> <p id="demo">一个段落。</p> <button type="button" onclick="myFunction()">点击这里</button> <p><b>注释：</b>myFunction 保存在名为 "myScript.js" 的外部文件中。</p> <script src="myScript.js"></script> </body> </html>
JavaScript语句、注释和代码块
1.JavaScript 语句
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程</title>
</head>
<body>
<h1>我的 Web 页面</h1>
<p id="demo">一个段落。</p>
<div id="myDIV">一个 DIV。</div>
<script>
document.getElementById("demo").innerHTML="你好 Dolly";
document.getElementById("myDIV").innerHTML="你最近怎么样?";
</script>
</body>
</html>2.JavaScript代码块
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程</title>
</head>
<body>
<h1>我的 Web 页面</h1>
<p id="myPar">我是一个段落。</p>
<div id="myDiv">我是一个div。</div>
<p>
<button type="button" onclick="myFunction()">点击这里</button>
</p>
<script>
function myFunction(){
document.getElementById("myPar").innerHTML="你好世界！";
document.getElementById("myDiv").innerHTML="你最近怎么样?";
}
</script>
<p>当您点击上面的按钮时，两个元素会改变。</p>
</body>
</html>3.JavaScript单行注释
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程</title>
</head>
<body>
<h1 id="myH1"></h1>
<p id="myP"></p>
<script>
// 输出标题：
document.getElementById("myH1").innerHTML="Welcome to my Homepage";
// 输出段落：
document.getElementById("myP").innerHTML="This is my first paragraph.";
</script>
<p><b>注释：</b>注释不会被执行。</p>
</body>
</html>4.JavaScript多行注释
<!DOCTYPE html>
<html>
<head>
<title>菜鸟教程测试实例</title>
<meta charset="utf-8">
</head>
<body>
<h1 id="myH1"></h1>
<p id="myP"></p>
<script>
/*
下面的这些代码会输出
一个标题和一个段落
并将代表主页的开始
*/
document.getElementById("myH1").innerHTML="欢迎来到菜鸟教程";
document.getElementById("myP").innerHTML="这是一个段落。";
</script>
<p><b>注释：</b>注释块不会被执行。</p>
</body>
</html>5.使用单行注释来防止执行
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程</title>
</head>
<body>
<h1 id="myH1"></h1>
<p id="myP"></p>
<script>
//document.getElementById("myH1").innerHTML="欢迎来到我的主页";
document.getElementById("myP").innerHTML="这是我的第一个段落。";
</script>
<p><strong>注意:</strong> 注释块不会被执行</p>
</body>
</html>6.使用多行注释来防止执行
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程</title>
</head>
<body>
<h1 id="myH1"></h1>
<p id="myP"></p>
<script>
//document.getElementById("myH1").innerHTML="欢迎来到我的主页";
document.getElementById("myP").innerHTML="这是我的第一个段落。";
</script>
<p><strong>注意:</strong> 注释块不会被执行</p>
</body>
</html>JavaScript变量
声明一个变量，为它赋值，然后显示出来
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程</title>
</head>
<body>
<script>
var firstname;
firstname="Hege";
document.write(firstname);
document.write("<br>");
firstname="Tove";
document.write(firstname);
</script>
<p>上面的脚本定义了一个变量，给变量分配一个值并显示，再次修改变量的值后，再次显示。
</p>
</body>好了，以上就是本篇文章的所有内容了，还想了解更多java入门学习教程记得多多关注本站消息哦。
推荐阅读：