スペースを含むjquery ID

IDにスペースがある場合、jQueryを使用してIDでDOM内のアイテムを選択する方法を誰かが知っていますか？

たとえば、私のアイテムのIDは

<div id="content Module">Stuff</div>

jQueryでこれをどのように選択しますか？

私がやれば

$("#content Module").whatever() 

jQueryは、コンテンツのIDとモジュールのIDの両方を持つアイテムを見つけようとしますが、これは私が探しているものではありません。

これらの2つのワードIDが広範囲に使用されている古いコードベースで作業しているため、すべてのIDを確認して変更することは悪いことです。

属性セレクターを使用します。

$("[id='content Module']").whatever();

または、タグも指定します：

$("div[id='content Module']").whatever();

$（ '＃id'）とは異なり、ページ内に同じIDを持つ複数の要素がある場合、これは複数の要素を返すことに注意してください。

スペースは使用しないでください。その理由は単純です。スペース文字はID属性には無効です。

IDトークンは文字（[A-Za-z]）で始まり、その後に任意の数の文字、数字（[0-9]）、ハイフン（ "-"）、アンダースコア（ "_"）、コロンを続けることができます（ "："）、およびピリオド（ "。"）。

しかし、標準を気にしない場合は、 $("[id='content Module']")

同様のスレッド> HTMLのid属性の有効な値は何ですか？

編集：HTML 4.01とHTML5でのIDの違い

HTML5は、id属性に対する追加の制限を取り除きます。ドキュメントで一意であることを除いて、残っている唯一の要件は、値に少なくとも1つの文字が含まれている必要があり（空にすることはできません）、スペース文字を含めることができないことです。

リンク：http : //mathiasbynens.be/notes/html5-id-class

誰かが気になった場合に備えて、スペースをエスケープするとうまくいくことがわかりました。これは、ターゲットDOMを制御できない場合（たとえば、ユーザースクリプト内から）に特に役立ちます。

$("#this\\ has\\ spaces");

必要な二重円記号に注意してください。

Chrisが提案したメソッドは、jQuery関数で動作するように適応できる可能性があります。

var element = document.getElementById('content Module');
$(element) ... ;

試すアイデア：

$("#content" +   + "Module").whatever()

$("#content" + %20 + "Module").whatever()

セミコロンは、JavaScriptエラーを引き起こす可能性があります。また、スペースを含まないようにIDを変更することをお勧めします。

また、お試しください document.getElementByID("content Module")

これでうまくいきました。

document.getElementById(escape('content Module'));

それはですが、HTMLでID属性値のスペースを持っていることは技術的に無効、あなたは実際にjQueryを使用してそれを選択することができます。

http://mothereffingcssescapes.com/#content%20moduleを参照してください。

<script>
  // document.getElementById or similar
  document.getElementById('content module');
  // document.querySelector or similar
  $('#content\\ module');
</script>

jQueryはSelectors APIのような構文を使用$('#content\\ module');するため、を使用して要素を選択できますid="content module"。

CSSで要素をターゲットにするには、次のようにエスケープできます。

<style>
  #content\ module {
    background: hotpink;
  }
</style>

これは、要素にIDの正確な値が必要な場合に機能します

$("[id='content Module']").whatever();

しかし、要素が他のIDの有無にかかわらず（クラスのように）それらの1つだけを持っているかどうかを確認したい場合

$("[id~='content']").whatever();

id="content"or id="content Module"またはor がある場合、これは要素を選択しますid="content Module other_ids"

私の場合、エスケープはスペースを％20に置き換えるため、エスケープが機能しないことがわかりました。代わりにreplaceを使用して、ページのh1をリストアイテムのテキストに置き換えました。メニューに含まれるもの：

<li id="Contact Us"\>Contact Us</li>

function setTitle(menu) {
    $("h1").text( $("li#" + menu.replace(" ", "\\ ")).text() );
}

jQueryでコンマやスペースを含む要素IDに問題があったため、これを実行しました。

var ele = $(document.getElementById('last, first'));

これにはスペースがあり、機能しません：

var ele = $('#last, first');

これにはカンマがあり、機能しません：

var ele = $('#last,first');

セレクターのその他の文字を（スペースとともに）エスケープします。

var escapeSelector = function(string) {
  string = string||"";
  if (typeof string !== 'string') return false;
    return string.replace( /(:|\.|\[|\]|,|=|@|\s|\(|\))/g, "\\$1" );

}
console.log($("div[data-id="+escapeSelector("Document (0).json")+"]").text());   

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div data-id="Document (0).json">Howdy</div>