Идентификаторы jquery с пробелами

Кто-нибудь знает, как выбрать элемент в DOM по ID с помощью jQuery, когда этот идентификатор имеет пробел?

Например, идентификатор моего элемента будет

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

Как я могу выбрать это с помощью jQuery?

Если я просто делаю

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

jQuery попытается найти элемент с идентификатором содержимого и идентификатором модуля, который не является тем, что я ищу.

Я должен добавить, что я работаю со старой базой кода, где эти два идентификатора слова широко используются, поэтому пройти и изменить все идентификаторы будет плохо.

Ответ 1

Используйте селектор атрибутов.

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

Или, лучше, укажите также тег:

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

Обратите внимание, что в отличие от $('# id'), это приведет к возврату нескольких элементов, если в вашей странице есть несколько элементов с одним и тем же идентификатором.

Ответ 2

Не используйте пробелы, причина для этого проста, символ пробела недействителен для атрибута ID.

Идентификаторы идентификатора должны начинаться с буквы ([A-Za-z]), и за ним может количество букв, цифр ([0-9]), дефисы ( "-" ), подчеркивания ( "_" ), colons ( ":" ) и периоды ( "." ).

Но если вы не заботитесь о стандартах, попробуйте $("[id='content Module']")

Похожие темы > Какие значения действительны для атрибута id в HTML?

Изменить: Как отличается идентификатор между HTML 4.01 и HTML5

HTML5 избавляется от дополнительных ограничений на атрибут id. останутся только требования - кроме того, что они уникальны в документе - что значение должно содержать по крайней мере один символ (не может быть пустым), и что он не может содержать любые пробельные символы.

Ссылка: http://mathiasbynens.be/notes/html5-id-class

Ответ 3

На всякий случай кому-то интересно, я обнаружил, что побег в пространстве будет работать, и, вероятно, лучше всего работает. Это особенно полезно, если у вас нет контроля над DOM-объектом (то есть пользовательским текстом):

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

Обратите внимание на двойную обратную косую черту, которая требуется.

Ответ 4

Метод, предложенный Крисом, может быть адаптирован для работы с функциями jQuery.

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

Ответ 5

Идея попробовать:

$("#content" + &amp;#032; + "Module").whatever()

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

Точка с запятой может вызывать ошибку javascript. Я также рекомендую изменить идентификатор, чтобы не было никаких пробелов.

Кроме того, попробуйте document.getElementByID("content Module")

Ответ 6

Это сработало для меня.

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

Ответ 7

В то время как его технически недействительно, чтобы иметь место в значении атрибута ID в HTML, вы можете фактически выбрать его с помощью jQuery.

См. http://mothereffingcssescapes.com/#content%20module:

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

jQuery использует синтаксис типа API-переключателей, поэтому вы можете использовать $('#content\\ module'); для выбора элемента с id="content module".

Чтобы настроить элемент в CSS, вы можете избежать его следующим образом:

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

Ответ 8

это может работать, если вы хотите, чтобы элемент имел точное значение для id

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

но если вы хотите проверить, имеет ли элемент только один из них (точно так же, как класс) с иными идентификаторами

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

это выберет элемент, если он имеет id="content" или id="content Module" или id="content Module other_ids"

Ответ 9

Я нашел для своего случая, что escape не работал, потому что он заменяет пробелы %20. Вместо этого я заменил вместо этого. чтобы заменить h1 страницы текстом элемента списка. Если меню содержит:

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

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

Ответ 10

У меня возникли проблемы с идентификаторами элементов, содержащими запятые и/или пробелы в jQuery, поэтому я сделал это, и он работал как шарм:

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

Это имеет пробелы и не работает:

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

Это запятая и не работает:

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