1、js是一门事件驱动型的编程语言；依靠事件去驱动，然后执行对应的程序。
2、 在js中有很多事件其中有一个事件叫做：鼠标单机；单词：click；且任何事件都会有一个事件句柄叫做：onclick；
3、事件和事件句柄区别：事件句柄是在事件单词前加on；而事件句柄是以HTML标签的属性存在的
4、onclick=”js代码”，执行原理： 页面打开时js代码并不会执行，只把JS代码注册到按钮的click事件上了，
等这个按钮发生click事件之后，注册在onclick后面的js代码会被浏览器自动调用
5、js代码弹出消息框： js中有一个内置的对象叫做：window，都是小写
window 代表浏览器对象，有一个函数：alert；
语法：window.alert(“消息”)；弹窗出现
JavaScript嵌入HTML方式一：弹窗：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML嵌入代码方式1</title>
</head>
<body>
<input type = "button" value="hello" onclick="window.alert('hello js')" />
<input type = "button" value="hello" onclick="window.alert('hello js')
window.alert('hello zs')
<!--window. 可以省去-->
<input type = "button" value="hello" onclick="alert('hello js')
alert('hello zs')
</body>
</html>
JavaScript嵌入HTML方式二：JavaScript脚本块：<script type=’text/javascript’></script>
JavaScript脚本块出现的位置没有要求，可以出现多次
暴露在JavaScript脚本块中的代码打开浏览器直接执行，遵守自上而下的顺序执行
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML嵌入代码方式2</title>
<!--
javascript 的脚本块在一个页面当中可以出现多次，没有要求
javascript 的脚本块出现的位置也没有要求，随意
-->
<script type="text/javascript">
alert("first....")
</script>
</head>
<body>
<!--方式2：脚本块方式打开页面就执行-->
<script type='text/javascript'>
/*
暴露在脚本块当中的程序，在页面打开的时候执行
并且遵守自上而下顺序依次追行执行，这个代码执行不需要事件
*/
window.alert("hello word");
//alert有阻挡当前页面加载的作用，直到用户点击确定按钮
window.alert("hello javaScript");
</script>
<script type="text/javascript">
//js代码单行注释
/*
js代码的多行注释
*/
</script>
<input type= "button" value="按钮对象" />
</body>
</html>
<script type="text/javascript">
alert("last....")
</script>
JavaScript嵌入HTML方式三：在需位置映入JavaScript脚本文件
<script type="text/javascript" src="3.js/3.js">
<!--引入js文件的同时可以写代码。但是代码不执行，没有用--> </script>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML嵌入代码方式3</title>
</head>
<body>
<!--在需要的位置引入js脚本文件-->
<!--引入外部独立的js文件时，技术文件中的代码会遵循自上而下的顺序依次执行-->
<!--结束的</script> 标签必须要有-->
<script type="text/javascript" src="3.js/3.js">
<!--引入js文件的同时可以写代码。但是代码不执行，没有用-->
</script>
<!--引入js文件时，同时可以引入脚本块-->
<script type="text/javascript">
alert("hello...")
</script>
</body>
</html>
原创文章，作者：306829225，如若转载，请注明出处：https://blog.ytso.com/tech/webdev/272541.html