JavaScript学记笔记--2

时间:2022-12-28 11:04:00

现在开始正式学习JavaScript的使用

上一篇中已经提到了JavaScript是一种脚本语言可插入HTML中,那么如何插入呢?

首先:

HTML 中的脚本必须位于 <script> 与 </script> 标签之间。

脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。

因此如果需要在HTML中插入JavaScript必须用到<script> 标签,与HTML类似<script> 与 </script> 标签之间为JavaScript的代码,同时也标定了何时开始何时结束


其次:

可以在 HTML 文档中放入不限数量的脚本。

脚本可位于 HTML 的 <body> 或 <head> 部分中,或者同时存在于两个部分中。

通常的做法是把函数放入 <head> 部分中,或者放在页面底部。这样就可以把它们安置到同一处位置,不会干扰页面的内容。



那么插入之后呢?通常,我们需要在某个事件发生时执行代码,比如当用户点击按钮时,实现字符的变换。那么这时就需要用到用到:

JavaScript 函数和事件

使用的方式就是:把 JavaScript 代码放入函数中,就可以在事件发生时调用该函数。

后面的章节再做详细解说。



<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{
document.getElementById("demo").innerHTML="My First JavaScript Function";
}
</script>
</head>

<body>

<h1>My Web Page</h1>

<p id="demo">A Paragraph.</p>

<button type="button" onclick="myFunction()">点击这里</button>

</body>
</html>

上面的代码是将JavaScript函数放置在HTML页面的<head>部分,同样的也可以放在<body>部分,只需进行下面的修改

<h1>My Web Page</h1>

<p id="demo">A Paragraph</p>

<button type="button" onclick="myFunction()">Try it</button>

<script>
function myFunction()
{
document.getElementById("demo").innerHTML="My First JavaScript Function";
}
</script>