Как получить доступ к идентификатору или стилю формы, если они содержат соответственно именованные входы?

Question

В этом примере

<form id="form1">
    <input type="text" name="style">
</form>
<form id="form2">
    <input type="text" name="id">
</form>

вы не можете получить доступ к объявлению стиля form1 или к идентификатору form2, поскольку именованные входы затеняют соответствующие свойства.

То же самое относится и к другим свойствам

Есть какие-нибудь обходные пути?

Редактировать: getAttribute работает для id, очевидно.Но не для style, childNodes, tagName и т. Д.

Я ищу что-то вроде этого:

getDomProp = (function() {
    if (window.__lookupGetter__) {
        var cleanForm = document.createElement('form');
        return function(form, key) {
            // works in Firefox, fails in Opera:
            return cleanForm.__lookupGetter__(key).call(form);
        };
    } else if (Object.getOwnPropertyDescriptor) {
        return function(form, key) {
            // does not work at all:
            // return Object.getOwnPropertyDescriptor(cleanForm, key).get.call(form);
        }
    } else {
        throw 'Not supported.';
    }
})();

Fiddle

Answer 1

Это все равно будет работать:

form.getAttribute('id');

PS. Не называйте ваши входные данные, которые в производственном коде:)

Answer 2

Используйте getAttribute для получения соответствующих атрибутов формы: http://jsfiddle.net/6d8sx/3/

alert('id: ' + form.getAttribute('id'));

Редактировать: getAttribute, кажется, работает в IE9, FF5 (не уверен в других).

Однако, присвоение имен этим элементам вызовет проблемы в дальнейшем (если не ваш код, то некоторые библиотеки или плагины могут запутаться).

Answer 3

yuse jquery: $('#form1').css() или $('#form2').attr('id').

Answer 4

Доступ к ним осуществляется с помощью .getAttribute(); http://reference.sitepoint.com/javascript/Element/getAttribute