显示JavaScript 运行结果
在 HTML 里，每个元素都可以有一个独一无二的 id。JavaScript 有个超好用的方法叫 document.getElementById(id)，可以精确地找到这些元素。找到之后，就能通过修改它们的 innerHTML 来更新内容啦。
比如下面这个小例子，就是通过 JavaScript 算出一个结果，然后展示在网页上的：
DOCTYPE html>
<html>
<head>
<title>innerHTML 小试验title>
head>
<body>
<h1>欢迎来到我的小天地h1>
<p>这里有个小段落，内容会变哦！p>
<p id="resultDisplay">p>
<script>
// 使用描述性变量名进行计算，并将结果展示在特定元素中
var sum = 5 + 6;
var resultElement = document.getElementById("resultDisplay");
resultElement.innerHTML = "算出来啦，结果是: " + sum;
script>
body>
html>
在这个例子里，有一个段落元素的 id 是 “resultDisplay”，用来展示算出来的结果。JavaScript 代码一执行，这个段落的内容就会变成“算出来啦，结果是: 11”。
document.write() 的小妙招与注意事项
document.write() 这个方法虽然能直接往 HTML 里写内容，但一般只在页面加载的时候用。如果页面加载完了再用这个方法，它会把整个页面的内容都换掉，那可就糟糕啦！
下面这个例子展示了 document.write() 的一个用法，但大家要注意这个方法在实际应用中可能会有问题哦：
DOCTYPE html>
<html>
<head>
<title>document.write() 小试验title>
head>
<body>
<h1>欢迎来到我的小天地h1>
<p>点下面的按钮，会有个数字跳出来哦。p>
<button id="showNumberButton">快来看数字button>
<script>
// 使用更具描述性的函数名，并避免使用document.write()
function displayNumber() {
var sum = 5 + 6;
alert("数字来啦，是: " + sum); // 使用alert代替document.write，因为后者在实际应用中可能会导致问题
}
// 获取按钮元素并为其添加点击事件监听器
var button = document.getElementById("showNumberButton");
button.addEventListener("click", displayNumber);
script>
body>
html>
注意：上面的代码已经修改了 document.write() 的问题，现在使用 alert() 来显示数字。这样做是为了避免 document.write() 可能导致的内容清空问题。
用 alert() 弹出小对话框
window.alert() 或者简写为 alert() 这个方法能在浏览器里弹出一个小对话框，用来显示一条消息和一个“确定”按钮。
下面是一个用 alert() 的小例子：
DOCTYPE html>
<html>
<head>
<title>alert() 小试验title>
head>
<body>
<h1>欢迎来到我的小天地h1>
<p>页面一加载完，就会有个小对话框跳出来哦。p>
<script>
// 页面加载完的时候弹出小对话框
window.onload = function() {
var sum = 5 + 6;
alert("页面加载好啦，数字是: " + sum);
};
script>
body>
html>
这段代码会在页面加载完的时候弹出一个对话框，里面写着“页面加载好啦，数字是: 11”。
用 console.log() 帮忙调试
console.log() 这个方法超级好用，可以在浏览器的控制台里输出信息。这对于追踪代码的执行和找错误特别有帮助。
下面是一个简单的 console.log() 用法小例子：
DOCTYPE html>
<html>
<head>
<title>console.log() 小试验title>
head>
<body>
<script>
// 在控制台里输出点小信息
var debugMessage = "开始调试啦...";
var sum = 5 + 6;
console.log(debugMessage);
console.log("5 + 6 的结果是:", sum);
script>
body>
html>
想看输出的信息，得打开浏览器的开发者工具（一般按 F12 键或者右键点击页面选“检查”就能打开），然后切换到“控制台”这个标签页。
JavaScript 与打印小功能
虽然 JavaScript 自己不能直接控制打印机，但它可以调用浏览器的打印功能哦。window.print() 这个方法就能弹出一个打印对话框，让用户选择打印机和设置。
下面是一个简单的打印按钮小例子：
DOCTYPE html>
<html>
<head>
<title>打印小试验title>
head>
<body>
<h1>欢迎打印我的页面h1>
<p>点下面的按钮就能打印这个页面啦。p>
<button id="printButton">我要打印button>
<script>
// 获取按钮元素并为其添加点击事件监听器以调用打印功能
var button = document.getElementById("printButton");
button.addEventListener("click", function() {
window.print();
});
script>
body>
html>
点击按钮后，浏览器将弹出一个打印对话框，用户可以选择是否打印该页面，并进行相应的打印设置。