首先呢 要成为WEB全栈工程师呢 JavaScript 是必须要会的 高级技术看自身兴趣爱好,但是基础必须掌握 因为有良好的基础学习jQuery会比较轻松。
js是一门轻量的脚本语言 我学它主要目的是针对HTML页面的响应。
1 JS在什么地方写?
JS可以在HTML中的head标签内出现,也可以在body标签中出现,或是在body标签下面写,你也可以把它放在一个后缀为 .js 的文件中。最常见的是在body标签后 和 生成js文件后引入。
1.1 在body后面写js
<!DOCTYPE html> <html> <head> <title>learn javascript</title> </head> <body> </body> {{--js--}} <script> alert("yo man what's up"); </script> </html>
1.2 外部引入
新生成一个js文件 在它的内部写你想写的js代码(这里我们就简单写写):
alert("yo man what's up");
然后在页面中引用:
<!DOCTYPE html> <html> <head> <title>learn javascript</title> </head> <body> </body> {{--js--}} <script src="demo.js"></script> </html>
2 输出功能
js常用的输出数据的方法有四种:
- document.write:写入HTML文档中。
- window.alert:弹出一个警告窗口。
- console.log:写入到浏览器控制台中。
- innerHTML:写入到HTML元素中。
2.1 写入HTML文档
<script> document.write("<h1>hohoho</h1>"); document.write(Date()) </script>
这仅仅是往HTML中写入内容,但是如果在页面已经加载完毕了在执行write的话 页面就会被覆盖。
2.2 警告窗
我们可以通过警告窗向用户展示错误信息或是别的,在开发中也可用于测试。
<script> window.alert("alert"); alert(1 + 1); </script>
2.3 写入浏览器控制台
<script> var number = 5 + 6; console.log("write to console:" + number) </script>
这样我们就可以打开浏览器 在开发者工具中的console控制台看见这段话了。很合适调试测试时使用。
2.4 写入HTML元素
这是最常用的方法了,它可以改变HTML中元素的内容。
<!DOCTYPE html> <html> <head> <title>learn javascript</title> </head> <body> <p id="demo" onclick="showDate()">现在几点?</p> </body> {{--js--}} <script> function showDate(){ // 首先通过ID来查找元素 然后用innerHTML来修改内容。 document.getElementById("demo").innerHTML = Date(); } </script> </html>