二、HTML嵌入JavaScript脚本(了解)



1、在<head></head>标签中使用<script></script>

<html>
<head>
<titel></title>
<script language = "javascript">
window.alert("hello world!");
</script>
</head>
<body></body>
</html>
实例(掌握):
需求:用HTML代码实现一个普通的按钮,当用户点击按钮的时候,执行一段JS代码。
知识点:1、JavaScript是基于事件驱动型的变成语言,当发生某个特殊的事件的时候执行一段特殊的程序。
2、我们可以将用户点击按钮看做一个鼠标单击事件,这个事件在JS中被称为click事件。
3、没一个JS事件都会对应一个事件句柄,事件句柄的名称是:on+事件名。例如:click是鼠标单击事件,onclick是鼠标单击事件句柄。
4、可以选择在事件句柄后面注册js代码。当某个事件发生后,注册在事件句柄后面的js代码会被自动执行。
5、以下js代码什么时候会执行?当用户单击按钮的时候,注册在onclick后面的js代码会被浏览器自动执行。
代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<input type="button" value="点击弹出" onclick="window.alert('hellow world!');" />

</body>

</html>
6、Windows是js中的内置对象,代表整个浏览器窗口,属于BOM中的一员
7、Windows这个内置对象有一个方法,叫做alert,这个方法可以帮助弹出消息框。
8、js中的字符串可以使用双引号括起来,也可以使用单引号括起来。
9、js语句以分号结尾
10、window.alert('hellow world!');中的window.可以省略。

2、在HTML页面独立的脚本块中编写js代码
1、<script></script> 标签不一定出现在<head></head>标签中,可以出现在HTML页面中的任何位置
2、整个HTML页面加载的时候,自上而下的顺序依次解释执行
例子:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<script type="text/javascript">
window.alert('Hello ');
window.alert(' World!');
</script>

</body>

</html>

3、在html页面引入外部js文件

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript" src="1.js"></script>
</head>
<body>


</body>

</html>


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM