Як вибрати html-вузли за ідентифікатором з jquery, коли id містить крапку?

Якби мій html виглядав так:

<td class="controlCell">
    <input class="inputText" id="SearchBag.CompanyName" name="SearchBag.CompanyName" type="text" value="" />
</td>

Як я можу вибрати # SearchBag.CompanyName з JQuery? Я не можу змусити його працювати, і я боюся, що ця точка все це порушує. Прикро, що перейменування всіх моїх ідентифікаторів було б багато роботи, не кажучи вже про втрату читабельності.

Примітка.
Будь ласка, не давайте говорити про те, як таблиці не створені для планування. Я дуже усвідомлюю цінність і недоліки CSS і намагаюся якомога більше використовувати його.

@Tomalak у коментарях:

Оскільки селекторам ідентифікаторів повинен передувати хеш-номер, тут не повинно бути ніяких двозначностей

"# Id.class" - це дійсний селектор, для якого потрібен ідентифікатор, і окремий клас; це дійсно і не завжди є абсолютно зайвим.

Правильний спосіб вибору буквального "." у CSS - це уникнути цього: "#id \ .moreid". Це використовувало проблеми в деяких старих браузерах (зокрема IE5.x), але всі сучасні настільні браузери підтримують це.

Цей же метод, здається, працює в jQuery 1.3.2, хоча я не перевіряв його ретельно; quickExpr не підбирає його, але більш задіяний селекторний аналізатор, здається, підходить правильно:

$('#SearchBag\\.CompanyName');

Одним із варіантів буде такий:

$("input[id='SearchBag.CompanyName']")

Вам не потрібно нічого уникати, якщо ви використовуєте document.getElementById:

$(document.getElementById('strange.id[]'))

getElementById передбачає, що вхід є лише атрибутом id, тому точка не буде інтерпретуватися як селектор класу.

Короткий відповідь : Якщо у вас є елемент з id = "foo.bar", ви можете використовувати селектор$("#foo\\.bar")

Більш відповідь : Це частина документації на jquery - селектори вибору, які ви можете знайти тут: http://api.jquery.com/category/selectors/

На ваше запитання дано відповідь на початку документації:

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

Вибір attr здається підходящим, коли ваш ідентифікатор знаходиться в змінній:

var id_you_want='foo.bar';
$('[id="' + id_you_want + '"]');

Це задокументовано в API вибору jQuery :

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

Коротше кажучи, префікс .с \\.

$('#SearchBag\\.CompanyName')

Проблема полягає в тому ., що відповідатимуть класу, так $('#SearchBag.CompanyName')би відповідали <div id="SearchBag" class="CompanyName">. Втечі, з якими втече \\., трактуються як звичайні, .не мають особливого значення, що відповідають ідентифікатору, який ви бажаєте.

Це стосується всіх символів, !"#$%&'()*+,./:;<=>?@[\]^`{|}~які в іншому випадку мали б особливе значення як селектор у jQuery.

Хлопці, хто шукає більш загальне рішення, я знайшов одне рішення, яке вставляє одну звороту косу рису перед будь-якими спеціальними символами, це вирішує питання, пов’язані з отриманням імені та ідентифікатора з div, який містить спеціальні символи.

"Str1.str2% str3" .замінити (/ [^ \ w \ s] / gi, '\\ $ &')

повертає "Str1 \\. str2 \\% str3"

Сподіваюся, це корисно!

Ви можете використовувати селектор атрибутів:

$("[id='SearchBag.CompanyName']");

Або ви можете вказати тип елемента:

$("input[id='SearchBag.CompanyName']");