输出Javascript的最佳方式?

我正在学习Javascript，我看到输出代码的首选方法是document.getElementById...和 Document.write 应该只用于测试...

这是输出任何脚本的最佳方式吗？代码到底在做什么？我写了以下代码，我不确定"demo"是如何发挥作用的，为什么有必要......

<html>
<head>
<script>
function addNumbers(arr){
var i, answer =0;
for(i=0; i<arr.length; i++){
answer += arr[i];
}
return answer;
}
</script>
</head>
<body>
<h4> Function addNumbers: </h4>
<p id="demo"></p>
<script> 
var myArray = [1,2,3,4,5,6,7,8,9];
document.getElementById("demo").innerHTML = addNumbers(myArray); 
</script>
</body>
</html>

后退一步，向前两步：

document.write是一组三个函数之一

document.open()打开文档从头开始编写，并删除现有文档内容(如果有(。
document.write( string)将字符串插入到用于构造网页的字符流中。
document.close()关闭文档进行写入。任何进一步的写入都将重新打开文档并清除过程中的现有内容。

现在考虑

在页面输入流的末尾，文档将自动关闭。
是使用"文档对象模型"("DOM"(构建的，可以从脚本中访问和操作。
document.open/write/close起源于 DOM 标准化并可供使用之前。

因此，document.write在现代网络编程中几乎没有用处。如果在页面完成加载后使用，它会清除页面。它几乎完全限于尚未学习 DOM 存在的学生的教程，偶尔在以编程方式编写使用window.open打开的子窗口的内容时。

页面中的所有 HTML 元素都作为 DOM 中的 HTML 元素节点存在。这些可以通过调用document.getElementById或document.querySelector等方法进行访问，并作为 JavaScript 对象值返回。HTML 选项因标记类型而异，但如果它们表示 HTML 容器元素，则具有innerHTML和textContent等属性，当使用脚本中的文本字符串更新时，这些属性会更改呈现页面的内容。

在回答您的问题时，"demo"是 HTMLParagraphElement 的 id 值，其中 id 值用于访问 DOM 中的特定元素 -id值在页面 HTML 中应该是唯一的。

(段落(元素对象是通过使用document.getElementById查询 DOM 来获取的。更改元素innerHTML内容随后会导致使用新内容重新呈现文档，从而更新页面的显示。

Demo 是指 id 为 "demo" 的段落。您可以使用 id(在 HTML 页面中必须是唯一的(来识别和使用 JavaScript 中的 html 标记。

document.write确实不再经常使用了。原因有很多。由于它在网上得到了很好的解释，请查看这些答案或本文。

如果您添加了一些缺少的标签(如</head>、<body>和<script>并且控制台日志正在发生，则您的代码工作正常。在下面的代码段中运行。

作为旁白，现在更好的做法是做你的javascript工作，并在页面底部的结束</body>标签之前加载。因为任何加载都发生在加载 DOM 之后。

function addNumbers(arr) {
var i, answer = 0;
for (i = 0; i < arr.length; i++) {
answer += arr[i];
}
return answer;
}
var myArray = [1, 2, 3, 4, 5, 6, 7, 8, 9];
document.getElementById("demo").innerHTML = addNumbers(myArray);
console.log(addNumbers(myArray))

<html>
<head>
</head>
<body>
<h4> Function addNumbers: </h4>
<p id="demo">This is a paragraph that can be identified using the id attribute.</p>
</body>
</html>

您的代码运行良好。在下面查看。我在这里没有看到任何问题。如果您想在带有演示 id 的元素内部页面上显示结果，那么它工作得很好，这就是这样做的方法。如果您想在控制台中打印您的值，那么控制台.log是正确的方法。为此，只需在代码中声明此数组var myArray = [1,2,3,4,5,6,7,8,9];后将函数传递给console.log(addNumbers(myArray))。

<html>
<head>
<script>
function addNumbers(arr){
var i, answer =0;
for(i=0; i<arr.length; i++){
answer += arr[i];
}
return answer;
}
</script>
</head>
<body>
<h4> Function addNumbers: </h4>
<p id="demo"></p>
<script> 
var myArray = [1,2,3,4,5,6,7,8,9];
document.getElementById("demo").innerHTML = addNumbers(myArray); 
</script>
</body>
</html>

相关内容

最新更新

热门标签：