Добавляем HTML-контролам DOM-свойство ссылки на их лейблы

[torbasow]

Как в Javascript получить лейбл (элемент label) по его контролу, и наоборот? Первое - легко и непринуждённо, через DOM-свойство control, а второе до сих пор никак, хотя свойство и для этого уже вроде как намечено (и в «Хроме», кажется, реализовано). А, нет! Первое тоже никак, потому что свойство control добавлено в четвёртой «Файерфокс», а целевая версия у нас - 3.6.

Значит, патчим DOM для обоих свойств. Как-то так:

if(!("labels" in HTMLInputElement.prototype)){ let labelsGetter=function(){ var labels=[]; if(this.hasAttribute("id")) labels=Array.prototype.slice.call(this.ownerDocument.querySelectorAll('label[for="'+this.getAttribute("id")+'"]')); var ancestor=this; while(ancestor.parentNode){ ancestor=ancestor.parentNode; if(ancestor.tagName==="label"){ if(labels.indexOf(ancestor)===-1) labels.push(ancestor); break; } } return labels; }; if(Object.defineProperty)//Fx4+ Object.defineProperty(HTMLInputElement.prototype, "labels", { configurable: true, enumerable: true, get: labelsGetter }); else HTMLInputElement.prototype.__defineGetter__("labels", labelsGetter); } if(!("control" in HTMLLabelElement.prototype)){ HTMLLabelElement.prototype.__defineGetter__("control", function() this.htmlFor!==""? this.ownerDocument.getElementById(this.htmlFor) : this.querySelector("button, input:not([type='hidden']), keygen, select, textarea") //Лейблы также могут быть для (http://www.w3.org/TR/html5/forms.html#category-label): output (Fx4+), progress (Fx6+), meter (Fx16+) ); }