在JavaScript中编写html，无需documet.write

write html in javascript without documet.write

本文关键字：无需 documet write html JavaScript      更新时间：2023-09-26
    <script >
    for(i=0;i<=9;i++)
    {
</script>
    <input type="button"  value="1"/>
<script type="text/javascript">     
    }
</script>

如果我使用 document.write 它打印 10 次，这个按钮只会打印 10 次，为什么？

JavaScript的行为

方式与PHP不同。无论您在<script>标签之间放置什么，它本身就是一个脚本。

因此，您有两个单独的脚本：这：

for(i=0;i<=9;i++)
{

而这个：

}

想象一下，如果将这两个脚本放入两个单独的文件中会发生什么？没错，两者都会因为语法错误而失败。如果你看一下控制台，你会看到我说的错误。

如果要打印 10 个按钮，请执行以下操作：

<div id="mainDiv">
</div>
<script>
    var mainDiv = document.getElementById('mainDiv');
    for(var i=0; i<10; i++){
       mainDiv.innerHtml += "<input type='button' value='1'>";
    }
</script>

这些脚本标记是单独的脚本。您可以使用第一个中定义的函数或变量，但不能同时使用 for 循环。

中间的 html 也不在脚本中。看起来您试图使用script标签，就好像它们是<?php?>标签一样。

document.write的替代方法是设置元素的内部HTML的内容或将元素添加到DOM中：

for(i=1;i<10;i++){
  var btn = document.createElement("button");    
  document.body.appendChild(btn);
}
HTML

不像PHP那样是模板引擎，因此您无法将代码块分成多个脚本标记。每个代码块必须完全放置在<script></script>标记对中。

如果您的目的是使用 Javascript 生成 10 个按钮，请使用document.write选项

您正在寻找某种服务器端模板。 请记住，JavaScript 在客户端上运行。

相关文章：