Метод jQuerys prop() возвращает неверный идентификатор

Question

Когда в форме есть вход с именем ="id", метод prop('id') возвращает элемент ввода вместо id в виде строки:

HTML

<form id="testform">
    <input name="id">
</form>

JS

var $form = $('#testform');

var wrongId = $form.prop('id');
var correctId = $form.attr('id');

alert(wrongId); // alerts the html input element
alert(correctId); // alerts the id testform

Кто-нибудь может мне это объяснить?

Я подготовил скрипку: https://jsfiddle.net/zosu17se/

спасибо и всего наилучшего

Answer 1

Это потому, что вы назвали вход idи имя или идентификатор входных данных, селекторов и других "элементов формы" присоединяются к родительской форме как свойства формы для более легкого доступа, поэтому form.id это вход, а не идентификатор элемента.

Не называйте вход idили любое другое свойство, к которому вы можете получить доступ, и проблема решена.

Пример странного кода, вызванного этим

var form = window.test; // note that element ID's are also attached to the global scope

form.id.value = 'test';
form.value.value = 'test more';
form.selectedIndex.value = '2';

<form id="test">
  <input name="id">
  <input name="value">
  
  <select id="selectedIndex">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
  </select>
</form>