単語の間隔はここで

Question

はコードの関連部分です私は（$（ドキュメント）.readyコールバックで）JSを持つ要素を追加した場合に適用されていないようです"です：

#navmenu 
{ 
word-spacing:5px; 
padding: 5px 5px 5px 15px; 
} 

これは、要素を追加するコードです：

$(document).ready(function(){ 
    $("#navmenu").append($("<a href=\"index.html\">foo</a>")); 
    $("#navmenu").append($("<a href=\"index.html\">bar</a>")); 
    $("#navmenu").append($("<a href=\"index.html\">baz</a>")); 
}); 

これは私が得るものです：

私はHTMLで直接これらの要素を記述する場合は、次のように：

<div id="navmenu"> 
<a href="index.html">foo</a> 
<a href="index.html">bar</a> 
<a href="index.html">baz</a> 
</div> 

私はこれ（見えるようになっているもの）を取得：

を私は "で確認Chromeですべての要素が同じであることを確認してください。なぜこれがうまくいかないのでしょうか？

Answer 1

はい、jQueryを使用して「入力」していません。

編集：

明らかHTML：

<div id="navmenu"> 
<a href="index.html">foo</a> [here is \n - enter] 
<a href="index.html">bar</a> [here is \n - enter] 
<a href="index.html">baz</a> [here is \n - enter] 
</div> 

はjQueryを使って建て：

<div id="navmenu"> 
<a href="index.html">foo</a><a href="index.html">bar</a><a href="index.html">baz</a> 
</div> 

をこれが:)私の理論です。 CSSを使用してmargin-rightをaに追加

Answer 2

この例では、単語間隔属性は使用していません。起こっていることは、あなたのhtmlの例では、改行がスペースとして解釈されているということです（これは、HTMLが正しく動作する方法です）。 jqueryの例では、このエフェクトを作成するためのスペースや改行はありません。あなたはあなたが望むものを得るために2つの選択肢があります。アンカー要素の余白やパディングを広げるか、スペースや改行をjqueryコードに追加するようにCSSを変更します。

これは、スペースを追加せずにやや近づける必要があります。あなたは、スペースを追加する必要が動作するように間隔単語については

#navmenu a { padding: 0.5em 0 0.5em 0; }

Answer 3

。

$("selector").append($("<a></a>", { 
    "href": "index.html", 
    "text": "foo" 
})).append(
    document.createTextNode(" ") 
).append($("<a></a>", { 
    "href": "index.html", 
    "text": "bar"   
})).append(
    document.createTextNode(" ") 
).append($("<a></a>", { 
    "href": "index.html", 
    "text": "baz"   
})); 

このようなスペースを追加することは、私の痛みのようです。代わりに別のCSSテクニックを使用してください。