首页 > 代码库 > Web开发技术——JavaScript语法1(操作HTML元素、注释)
Web开发技术——JavaScript语法1(操作HTML元素、注释)
JavaScript 通常用于操作 HTML 元素
操作 HTML 元素
如需从 JavaScript 访问某个 HTML 元素，您可以使用 document.getElementById(id) 方法。
请使用 "id" 属性来标识 HTML 元素：
例子
通过指定的 id 来访问 HTML 元素，并改变其内容：
<!DOCTYPE html><html><body> <h1>My First Web Page</h1> <p id="demo">My First Paragraph</p> <script>document.getElementById("demo").innerHTML = "My First JavaScript";</script></body></html>
JavaScript 由 web 浏览器来执行。在这种情况下，浏览器将访问 id="demo" 的 HTML 元素，并把它的内容（innerHTML）替换为 "My First JavaScript"。
写到文档输出
下面的例子直接把 <p> 元素写到 HTML 文档输出中：
实例
<!DOCTYPE html><html><body> <h1>My First Web Page</h1> <script>document.write("<p>My First JavaScript</p>");</script></body></html>
警告
请使用 document.write() 仅仅向文档输出写内容。
如果在文档已完成加载后执行 document.write，整个 HTML 页面将被覆盖：
实例
<!DOCTYPE html><html><body> <h1>My First Web Page</h1> <p>My First Paragraph.</p> <button onclick="myFunction()">点击这里</button> <script> function myFunction() { document.write("糟糕！文档消失了。"); }</script></body></html>
Windows 8 中的 JavaScript
提示：微软支持通过 JavaScript 创建 Windows 8 app。
对于因特网和视窗操作系统，JavaScript 都意味着未来。
JavaScript 语句
JavaScript 语句向浏览器发出的命令。语句的作用是告诉浏览器该做什么。
下面的 JavaScript 语句向 id="demo" 的 HTML 元素输出文本 "Hello World"：
document.getElementById("demo").innerHTML="Hello World";分号 ;
分号用于分隔 JavaScript 语句。
通常我们在每条可执行的语句结尾添加分号。
使用分号的另一用处是在一行中编写多条语句。
提示：您也可能看到不带有分号的案例。
在 JavaScript 中，用分号来结束语句是可选的。
JavaScript 代码
JavaScript 代码（或者只有 JavaScript）是 JavaScript 语句的序列。
浏览器会按照编写顺序来执行每条语句。
本例将操作两个 HTML 元素：
实例
document.getElementById("demo").innerHTML="Hello World";document.getElementById("myDIV").innerHTML="How are you?";JavaScript 代码块
JavaScript 语句通过代码块的形式进行组合。
块由左花括号开始，由右花括号结束。
块的作用是使语句序列一起执行。
JavaScript 函数是将语句组合在块中的典型例子。
下面的例子将运行可操作两个 HTML 元素的函数：
实例
function myFunction()
{document.getElementById("demo").innerHTML="Hello World";document.getElementById("myDIV").innerHTML="How are you?";}
JavaScript 对大小写敏感。
JavaScript 对大小写是敏感的。
当编写 JavaScript 语句时，请留意是否关闭大小写切换键。
函数 getElementById 与 getElementbyID 是不同的。
同样，变量 myVariable 与 MyVariable 也是不同的。
空格
JavaScript 会忽略多余的空格。您可以向脚本添加空格，来提高其可读性。下面的两行代码是等效的：
var name="Hello";
var name = "Hello";
对代码行进行折行
您可以在文本字符串中使用反斜杠对代码行进行换行。下面的例子会正确地显示：
document.write("Hello \World!");
不过，您不能像这样折行：
document.write \
("Hello World!");您知道吗？
提示：JavaScript 是脚本语言。浏览器会在读取代码时，逐行地执行脚本代码。而对于传统编程来说，会在执行前对所有代码进行编译。
JavaScript 注释
JavaScript 注释可用于提高代码的可读性。
JavaScript 注释
JavaScript 不会执行注释。
我们可以添加注释来对 JavaScript 进行解释，或者提高代码的可读性。
单行注释以 // 开头。
例子
下面的例子使用单行注释来解释代码：
// 输出标题：document.getElementById("myH1").innerHTML="Welcome to my Homepage";// 输出段落：document.getElementById("myP").innerHTML="This is my first paragraph.";
JavaScript 多行注释
多行注释以 /* 开始，以 */ 结尾。
下面的例子使用多行注释来解释代码：
例子
/*下面的这些代码会输出一个标题和一个段落并将代表主页的开始*/document.getElementById("myH1").innerHTML="Welcome to my Homepage";document.getElementById("myP").innerHTML="This is my first paragraph.";
使用注释来阻止执行
例子 1
在下面的例子中，注释用于阻止其中一条代码行的执行（可用于调试）：
//document.getElementById("myH1").innerHTML="Welcome to my Homepage";document.getElementById("myP").innerHTML="This is my first paragraph.";
例子 2
在下面的例子中，注释用于阻止代码块的执行（可用于调试）：
/*document.getElementById("myH1").innerHTML="Welcome to my Homepage";document.getElementById("myP").innerHTML="This is my first paragraph.";*/
在行末使用注释
在下面的例子中，我们把注释放到代码行的结尾处：
例子
var x=5; // 声明 x 并把 5 赋值给它
var y=x+2; // 声明 y 并把 x+2 赋值给它
Web开发技术——JavaScript语法1(操作HTML元素、注释)