ID jquery dengan spasi

Apakah ada yang tahu cara memilih item di DOM dengan ID dengan jQuery, ketika ID itu memiliki spasi?

Misalnya, ID barang saya akan

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

Bagaimana saya memilih ini dengan jQuery?

Jika saya lakukan

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

jQuery akan mencoba menemukan item dengan ID konten dan ID Modul, yang bukan yang saya cari.

Saya harus menambahkan bahwa saya bekerja dengan basis kode lama di mana dua kata id ini digunakan secara luas, jadi melalui dan mengubah semua ID akan menjadi buruk.

Gunakan pemilih atribut.

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

Atau, lebih baik, tentukan tag juga:

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

Perhatikan bahwa tidak seperti $ ('# id'), ini akan mengembalikan beberapa elemen jika Anda memiliki beberapa elemen dengan id yang sama di dalam halaman Anda.

Jangan gunakan spasi, alasannya sederhana, karakter spasi bukan valid untuk atribut ID.

Token ID harus dimulai dengan huruf ([A-Za-z]) dan dapat diikuti oleh sejumlah huruf, digit ([0-9]), tanda hubung ("-"), garis bawah ("_"), titik dua (":"), dan titik (".").

Tetapi jika Anda tidak peduli dengan standar coba $("[id='content Module']")

Utas serupa> Apa nilai yang valid untuk atribut id dalam HTML?

Sunting: Perbedaan id antara HTML 4.01 dan HTML5

HTML5 menghilangkan pembatasan tambahan pada atribut id. Satu-satunya persyaratan yang tersisa - selain unik di dalam dokumen - adalah bahwa nilainya harus mengandung setidaknya satu karakter (tidak boleh kosong), dan tidak boleh mengandung karakter spasi apa pun.

Tautan: http://mathiasbynens.be/notes/html5-id-class

Kalau-kalau ada yang ingin tahu, saya menemukan bahwa melarikan diri ruang akan berhasil. Ini sangat berguna ketika Anda tidak memiliki kendali atas DOM target (misalnya dari dalam skrip pengguna):

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

Perhatikan double-backslash, yang diperlukan.

Metode yang disarankan Chris kemungkinan dapat disesuaikan untuk bekerja dengan fungsi jQuery.

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

Sebuah ide untuk dicoba:

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

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

Tanda titik koma dapat menyebabkan kesalahan javascript. Saya juga merekomendasikan untuk mengubah ID agar tidak memiliki spasi.

Juga coba document.getElementByID("content Module")

Ini berhasil untuk saya.

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

Meskipun secara teknis tidak valid memiliki ruang dalam nilai atribut ID dalam HTML , Anda sebenarnya dapat memilihnya menggunakan jQuery.

Lihat http://mothereffingcssescapes.com/#content%20module :

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

jQuery menggunakan sintaks seperti Selectors API, sehingga Anda bisa menggunakan $('#content\\ module');untuk memilih elemen dengan id="content module".

Untuk menargetkan elemen dalam CSS, Anda dapat menghindarinya seperti ini:

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

ini bisa berfungsi jika Anda ingin elemen memiliki nilai tepat untuk id

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

tetapi jika Anda ingin memeriksa apakah elemen hanya memiliki salah satunya (seperti kelas) dengan atau tanpa id lainnya

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

ini akan memilih elemen jika memiliki id="content"atau id="content Module"atauid="content Module other_ids"

Saya menemukan kasus saya bahwa melarikan diri tidak berfungsi karena ia mengganti ruang dengan% 20. Saya menggunakan ganti sebagai gantinya untuk mengganti h1 halaman dengan teks dari item daftar. Jika menu berisi:

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

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

Saya mengalami masalah dengan id elemen yang mengandung koma dan / atau spasi di jQuery, jadi saya melakukan ini dan itu berfungsi seperti pesona:

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

Ini memiliki ruang dan tidak berfungsi:

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

Ini memiliki koma dan tidak berfungsi:

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

Meloloskan setiap karakter misc pada pemilih (bersama dengan spasi) .

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>