Элемент DOM и объект jquery

Question

, если я получаю доступ к любому элементу по идентификатору, используя следующий код.

$("#container_svg_John_0") 

он будет возвращать объект, содержащий элемент в индексе "0". то есть объект [0] будет содержать элемент. Я хочу знать, что в некоторых случаях поиск других элементов даст элемент непосредственно (вернет элемент DOM). в чем разница между ними.

Если доступ к идентификатору этого объекта будет возвращен не определен.

$("#container_svg_John_0").id 

но когда я переписываю это как

$("#container_svg_John_0")[0].id 

он возвращает идентификатор элемента. каждый раз обращаясь к этому выше. как я могу получить доступ к объекту, который содержит только один элемент в позиции «0», вместо указания [0]. и как он отличается в других случаях?

Answer 1

$("#container_svg_John_0") - объект jQuery, который имеет id.

$("#container_svg_John_0")[0] возвращает элемент dom, в котором есть id.

Поэтому в основном ниже true:

$("#container_svg_John_0").attr('id') === $("#container_svg_John_0")[0].id 

Answer 2

Вы не используете объект Jquery правильно - Правильный путь:

$("#container_svg_John_0").attr('id'); 

Это DOM элемент $("#container_svg_John_0")[0] поэтому действует для вызова

$("#container_svg_John_0")[0].id

Answer 3

Если преобразовать объект JQuery к элементу DOM, вы можете сделать следующее

var dom_elem = $("#container_svg_John_0").get(0); 

alert(dom_elem.id); 

Если вы хотите получить доступ к атрибуту JQuery объекта, сделать

$("#container_svg_John_0").attr('id') 
//or 
$("#container_svg_John_0").attr('class') //etc etc 

Но у вас уже есть container_svg_John_0 внутри $("#container_svg_John_0") селектора : D

Answer 4

$("#container_svg_John_0") является объект JQuery, таким образом, вы должны использовать attr(), чтобы получить его идентификатор ...

$("#container_svg_John_0").attr('id'); 

, где, как,

$("#container_svg_John_0")[0] возвращает объект DOM, и, следовательно, вам нужно использовать [0].id, чтобы получить идентификатор первого элемента.