Идентификаторы 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" + &#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');