jQuery не находит компонент IMG по его идентификатору - PullRequest
1 голос
/ 17 февраля 2020

У меня есть веб-страница, которая содержит такой код:

<img class="img-qrcode" id="img_123.000.00.01" 
     src="http://localhost:7777/data/code_img\123.000.00.01.png" 
     alt="./data/code_img\123.000.00.01.png" style="display:none">

Я хочу найти его с помощью jQuery. По какой-то причине jQuery не находит его по идентификатору с кодом:

$("#img_123.000.00.01")

Добавленный снимок экрана показывает, что он возвращает пустой массив.

The img with this ID exists but jquery does not see it

Почему не находит элемент с идентификатором?

Ответы [ 5 ]

2 голосов
/ 17 февраля 2020

Используя селектор атрибута для id, вам не нужно беспокоиться о том, что вы можете избежать выбора класса (.)

let img = $("img[id='img_123.000.00.01']");
console.log(img.attr('src'))
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<img class="img-qrcode" id="img_123.000.00.01" 
     src="http://localhost:7777/data/code_img\123.000.00.01.png" 
     alt="./data/code_img\123.000.00.01.png" style="display:none">
1 голос
/ 17 февраля 2020

Символ . имеет особое значение в селекторе (он запускает селектор класса), поэтому вам нужно его экранировать. (Не забудьте экранировать символ sla sh в строковом литерале.)

Как правило, просто избегать использования глав . в идентификаторе.

0 голосов
/ 17 февраля 2020

Когда некоторые специальные символы находятся в селекторе jquery, вам нужно добавить 100 \\ 』

console.log($("#img_123\\.000\\.00\\.01"));
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title>Title of the document</title>
</head>

<body>
  <img class="img-qrcode" id="img_123.000.00.01" src="http://localhost:7777/data/code_img\123.000.00.01.png" alt="./data/code_img\123.000.00.01.png" style="display:none">
</body>

</html>
0 голосов
/ 17 февраля 2020

Поскольку #id.className является действительным селектором, jQuery принимает это так и пытается найти такой элемент. В вашем случае вам придется выйти из точки.

Измените $("#img_123.000.00.01") на $("#img_123\\.000\\.00\\.01"), и оно будет работать.

Официальная jQuery документация (https://api.jquery.com/category/selectors/) ясно говорит об этом.

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

0 голосов
/ 17 февраля 2020

Найти с ^

let img = $("img[id^='img_123']");
console.log(img.attr('src'))
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<img class="img-qrcode" id="img_123" 
     src="http://localhost:7777/data/code_img\123.000.00.01.png" 
     alt="./data/code_img\123.000.00.01.png" style="display:none">
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...