boşluk içeren jquery kimlikleri

Kimlikte boşluk varken, jQuery ile DOM'daki bir öğeyi Kimliğe göre seçmeyi bilen var mı?

Örneğin, öğemin kimliği şöyle olacaktır:

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

Bunu jQuery ile nasıl seçerim?

Sadece yaparsam

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

jQuery, aradığım şey olmayan hem içerik kimliğine hem de Modül kimliğine sahip bir öğe bulmaya çalışacaktır.

Bu iki kelime kimliğinin yaygın olarak kullanıldığı eski bir kod tabanıyla çalıştığımı eklemeliyim, bu nedenle tüm kimlikleri gözden geçirmek ve değiştirmek kötü olur.

Bir öznitelik seçici kullanın.

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

Ya da daha iyisi etiketi de belirtin:

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

$ ['# İd'] 'den farklı olarak, sayfanızda aynı kimliğe sahip birden çok öğeniz varsa, bunun birden çok öğe döndüreceğini unutmayın.

Boşluk kullanmayın, bunun nedeni basittir, boşluk karakteri ID özelliği için geçerli değildir.

Kimlik simgeleri bir harfle ([A-Za-z]) başlamalıdır ve ardından herhangi bir sayıda harf, rakam ([0-9]), kısa çizgi ("-"), alt çizgi ("_"), iki nokta üst üste gelebilir (":") ve noktalar (".").

Ama standartları umursamıyorsanız deneyin $("[id='content Module']")

Benzer konu> HTML'deki id özniteliği için geçerli değerler nelerdir?

Düzenleme: HTML 4.01 ve HTML5 arasında kimlik farkı nedir?

HTML5, id özniteliğindeki ek kısıtlamalardan kurtulur. Belgede benzersiz olmak dışında kalan tek gereksinim, değerin en az bir karakter içermesi (boş olamaz) ve herhangi bir boşluk karakteri içermemesidir.

Bağlantı: http://mathiasbynens.be/notes/html5-id-class

Herhangi birinin merak etmesi durumunda, alandan kaçmanın işe yarayacağını buldum. Bu, özellikle hedef DOM üzerinde kontrolünüz olmadığında (örneğin bir kullanıcı yazısının içinden) kullanışlıdır:

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

Gerekli olan çift ters eğik çizgiye dikkat edin.

Chris'in önerdiği yöntem muhtemelen jQuery işlevleriyle çalışmak üzere uyarlanabilir.

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

Denenecek bir fikir:

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

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

Noktalı virgül, javascript hatasına neden olabilir. Kimliği boşluk içermeyecek şekilde değiştirmenizi de öneririm.

Ayrıca denemek document.getElementByID("content Module")

Bu benim için çalıştı.

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

HTML'de bir ID öznitelik değerinde boşluk olması teknik olarak geçersiz olsa da , aslında jQuery kullanarak bunu seçebilirsiniz.

Bkz. Http://mothereffingcssescapes.com/#content%20module :

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

jQuery, Selectors API benzeri bir sözdizimi kullanır, bu nedenle $('#content\\ module');öğesini kullanarak id="content module".

CSS'de öğeyi hedeflemek için, şu şekilde kaçabilirsiniz:

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

bu, öğenin id için tam değere sahip olmasını istiyorsanız işe yarayabilir

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

ancak öğenin bunlardan yalnızca birine sahip olup olmadığını (tıpkı sınıf gibi) diğer kimliklerle veya kimlikler olmadan kontrol etmek istiyorsanız

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

bu, varsa id="content"veya id="content Module"veya veyaid="content Module other_ids"

Vakam için kaçışın, boşlukları% 20 ile değiştirdiği için işe yaramadığını buldum. Bunun yerine, örneğin sayfanın h1'ini bir liste öğesinin metni ile değiştirmek için değiştirmeyi kullandım. Menü şunları içeriyorsa:

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

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

JQuery'de virgül ve / veya boşluk içeren öğe kimlikleriyle ilgili sorunlar yaşıyordum, bu yüzden bunu yaptım ve harika çalıştı:

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

Bunun boşlukları var ve çalışmıyor:

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

Burada virgül var ve çalışmıyor:

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

Seçici üzerindeki herhangi bir çeşitli karakterden (boşluklarla birlikte) kaçış .

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>