blocks|key|3996020|text|您可以按以下方式添加页边距：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3996021|​|3996022|let+inp+=+document.createElement("input");
inp.style.margin='4px';
document.body.appendChild(inp);
inp+=+document.createElement("input");
inp.style.margin='4px';
document.body.appendChild(inp);|code-block|syntax|javascript|3996023|3996024|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|M|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|N|8|@]|9|@]|A|$G|H]]|$1|I|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|J|3|-4|5|6|7|P|8|@]|9|@]|A|$]]]|K|$]]

<p>You can add the margin as follows:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>let inp = document.createElement("input");
inp.style.margin='4px';
document.body.appendChild(inp);
inp = document.createElement("input");
inp.style.margin='4px';
document.body.appendChild(inp);</code></pre>
</div>
</div>
</p>


blocks|key|3121654|text|添加空白或给类留页边距|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3121655|​|3121656|//+without
document.body.appendChild(document.createElement("input"));
document.body.appendChild(document.createElement("input"));

document.body.appendChild(document.createElement("hr"));

//+with+whitespace

document.body.appendChild(document.createElement("input"));
document.body.appendChild(document.createTextNode("+"));
document.body.appendChild(document.createElement("input"));

document.body.appendChild(document.createElement("hr"));

//+with+css
const+input+=+document.createElement("input");
input.classList.add("spaced")
document.body.appendChild(input);
document.body.appendChild(input.cloneNode(1));|code-block|syntax|javascript|3121657|.spaced+{+margin-right:5px;+}|3121658|3121659|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|P|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|K|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|M|$]]

<p>Add a whitespace or give a class with margins</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>// without
document.body.appendChild(document.createElement("input"));
document.body.appendChild(document.createElement("input"));

document.body.appendChild(document.createElement("hr"));

// with whitespace

document.body.appendChild(document.createElement("input"));
document.body.appendChild(document.createTextNode(" "));
document.body.appendChild(document.createElement("input"));

document.body.appendChild(document.createElement("hr"));

// with css
const input = document.createElement("input");
input.classList.add("spaced")
document.body.appendChild(input);
document.body.appendChild(input.cloneNode(1));</code></pre>
<pre class="snippet-code-css lang-css prettyprint-override"><code>.spaced { margin-right:5px; }</code></pre>
</div>
</div>
</p>


blocks|key|3996047|text|输入之间的空格不是空白处，它很可能是空白a空格，所以当您添加一个带有js的元素时，它没有空格，如果您用带有font-size:+0样式的div包装这两个输入，那么即使是在html中添加的输入，也会看到这个空格不皂化。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|3996048|entityMap^0|1H|C|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|K|8|@]|D|@]|E|$]]]|G|$]]

<p>The space between the input is not a margin, it's propably a white a space, so when you add an element with js it's appended without spaces, if you wrap the two inputs with a div with the style <code>font-size: 0</code> you will see this space dissapear even for the inputs added in html</p>


<p>When I add input tags with DOM <code>appendChild()</code> in a js script they seem to have no margin as they have no separation in between them. Input tags that have been written in the html file have that separation. The element inspector says they all have the same style.</p>

<p><img src="https://i.stack.imgur.com/nKzBw.png" alt=""></p>

<p>The js script:</p>

<pre><code>document.body.appendChild(document.createElement("input"));
</code></pre>

<p>I don't know how to google this problem so I ask here, what's going on and how can I fix this in the js script?</p>


Adding an input tag with js and dom appendChild seems to have no margin

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

当我在js脚本中添加带有DOM appendChild()的输入标记时，它们似乎没有边距，因为它们之间没有分离。在html文件中写入的输入标记有这种分隔。元素检验员说他们都有相同的风格。​​js脚本：document.body.appendChild(document.createElement("input"));我...

问添加带有js和dom appendChild的输入标记似乎没有余地。
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问添加带有js和dom appendChild的输入标记似乎没有余地。EN