javascript / jQuery не может найти элемент с испорченным идентификатором

Question

Я пытаюсь получить доступ к элементу в MS CRM 2011 со следующим идентификатором: счет | NoRelationship | Форма | B_GenerateInvoice-Large

Я вижу этот элемент в инструментах разработчика IE:

К сожалению, я всегда получаю нулевое значение, когда пытаюсь найти этот элемент.

Я пробовал следующее:

alert(document.getElementById('account|NoRelationship|Form|B_GenerateInvoice-Large'));
alert($("[id='account|NoRelationship|Form|B_GenerateInvoice-Large]").html());
alert($(jq("account|NoRelationship|Form|B_GenerateInvoice-Large")).html());  // jq() adds the '#' and escapes special characters
alert($("#account|NoRelationship|Form|B_GenerateInvoice-Large").html());
alert(document.getElementById("#account\\|NoRelationship\\|Form\\|B_GenerateInvoice-Large"));
alert($("#account\\|NoRelationship\\|Form\\|B_GenerateInvoice-Large").html());

Все они не могут найти элемент.

Я что-то упускаю здесь очевидное?

Решение:

JavaScript был внутри iframe, в то время как элемент находился вне iframe.

Мне не удалось ее решить.

Answer 1

Руководство пользователя jQuery гласит:

Если вы хотите использовать любой из метасимволы (такие как ! "# $% & '() * +,. / :; <=>? @ [] ^` {|} ~) как буквальная часть имени, вы должны избежать персонажа с двумя обратная косая черта: \\. Например, если вы есть элемент с id = "foo.bar", вы можно использовать селектор $ ("# foo \\. bar"). Спецификация W3C CSS содержит полный набор правил, касающихся допустимых селекторов CSS .

Итак, попробуйте это:

$('#account\\|NoRelationship\\|Form\\|B_GenerateInvoice-Large')...

jsFiddle Demo

РЕДАКТИРОВАТЬ : я успешно протестировал свою скрипку в Chrome, Firefox 4, IE9, IE8 и IE7, она отлично работает.

Answer 2

Какая версия HTML на странице, декларирующей, что она использует?Потому что это действительный HTML5 id, но это недействительный HTML4.01 и более ранние id.(Это также недопустимый CSS id, который неопределенно актуален, если вы используете что-то вроде jQuery для поиска, поскольку jQuery использует селекторы CSS.)

Скрипка в Ответ @ bazmegakapa работает для меня в Chrome, но, возможно, ваша страница объявляет другую версию HTML, или, возможно, менее продвинутый браузер не любит ее и т. д.

Answer 3

Из документации jQuery:

Если вы хотите использовать любой из метасимволов (например,! "# $% & '() * +,. / :; <=>? @ [] ^ `{|} ~) как буквальная часть имени, вы должны экранировать символ двумя обратными слешами: \. Например, если у вас есть элемент с id =" foo.bar ", вы можете использовать селектор $("#foo \ .bar").

Так что это должно работать:

alert($("#account\\|NoRelationship\\|Form\\|B_GenerateInvoice-Large").html());

И это действительно так: http://jsfiddle.net/Cdz9w/

Answer 4

Это может быть ошибка в браузере, поскольку спецификация HTML5 допускает любой символ, кроме пробелов в атрибуте id

ID #

Любая строка со следующими ограничениями:

должен быть длиной не менее одного символа

не должно содержать пробелов

однако, он заключен в том, чтобы не вставлять какой-либо изношенный символ в атрибут id, только цифры, буквы и подчеркивание:)