前端之JavaScript第二天学习(5)

时间:2021-08-09 20:54:53

JavaScript 语句

JavaScript 语句向浏览器发出的命令。语句的作用是告诉浏览器该做什么。

下面的 JavaScript 语句向 id="demo" 的 HTML 元素输出文本 "Hello World":

document.getElementById("demo").innerHTML="Hello World";

分号 ;

分号用于分隔 JavaScript 语句。

通常我们在每条可执行的语句结尾添加分号。

使用分号的另一用处是在一行中编写多条语句。

提示:您也可能看到不带有分号的案例。

在 JavaScript 中,用分号来结束语句是可选的。

JavaScript 代码

JavaScript 代码(或者只有 JavaScript)是 JavaScript 语句的序列。

浏览器会按照编写顺序来执行每条语句。

本例将操作两个 HTML 元素:

实例:

<!DOCTYPE html>
<html>
<body>

<h1>My Web Page</h1>

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

<div id="myDIV">A DIV.</div>

<script>
document.getElementById(
"demo").innerHTML="Hello World";
document.getElementById(
"myDIV").innerHTML="How are you?";
</script>

</body>
</html>

效果:

My Web Page

Hello World

How are you?

JavaScript 代码块

JavaScript 语句通过代码块的形式进行组合。

块由左花括号开始,由右花括号结束。

块的作用是使语句序列一起执行。

JavaScript 函数是将语句组合在块中的典型例子。

下面的例子将运行可操作两个 HTML 元素的函数:

实例:

<!DOCTYPE html>
<html>
<body>

<h1>My Web Page</h1>

<p id="myPar">I am a paragraph.</p>
<div id="myDiv">I am a div.</div>

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

<script>
function myFunction()
{
document.getElementById(
"myPar").innerHTML="Hello World";
document.getElementById(
"myDiv").innerHTML="How are you?";
}
</script>

<p>当您点击上面的按钮时,两个元素会改变。</p>

</body>
</html>

效果:

My Web Page

I am a paragraph.

I am a div.

点击这里

当您点击上面的按钮时,两个元素会改变。

您将在稍后的章节学到更多有关函数的知识。

JavaScript 对大小写敏感。

JavaScript 对大小写是敏感的。

当编写 JavaScript 语句时,请留意是否关闭大小写切换键。

函数 getElementById 与 getElementbyID 是不同的。

同样,变量 myVariable 与 MyVariable 也是不同的。

空格

JavaScript 会忽略多余的空格。您可以向脚本添加空格,来提高其可读性。下面的两行代码是等效的:

var name="Hello";

var name = "Hello";

对代码行进行折行

您可以在文本字符串中使用反斜杠对代码行进行换行。下面的例子会正确地显示:

document.write("Hello \

World!");

不过,您不能像这样折行:

document.write \

("Hello World!");

您知道吗?

提示:JavaScript 是脚本语言。浏览器会在读取代码时,逐行地执行脚本代码。而对于传统编程来说,会在执行前对所有代码进行编译。