Вопрос по getArrtribute()

[Luca]

Здравствуйте

let div = document.createElement('div');
document.body.appendChild(div);
div.onclick = function(){alert('alert')};
alert(div.getAttribute('onclick'));

результат null

почему?

[Alexandroppolus]

Luca,
потому что тут "односторонняя" связь. Вот если бы ты назначил onclick через setAttribute

div.setAttribute('onclick', "alert('alert')");

то и div.onclick бы появился. Но не наоборот.

[Luca]

интересно получается:

div.onclick = function(){alert('alert')};
div.addEventListener('click', function(){alert('alert')});
div.setAttribute('onclick','alert("alert")');

тремя способами, получается, можно задать одну и ту же реакцию на щелчок по div.

зачем всё по несколько раз дублировать? куча свойств просто заранее уже есть и минимум в двух экземплярах (может кто и еще способ подскажет). Пока данная ситуация в голове "не улеглась".

let atrMap  = new Map();
    for (let i in div){
       atrMap.set(i,div[i]);
    }
console.error(atrMap.size);  
 let n = 0;
 for (let i in div){
        if (  atrMap.has(i) && (div[i] === atrMap.get(i) ) )
        console.warn(`${i}=>${div.getAttribute(i)}`);
    }
console.error(n);

227 дубликатов получается что ли? притом они полностью идентичны...
две идентичных хэш-таблицы создаются что ли для каждого Node
одна для доступа через точечную нотацию, а вторая set,get
притом, что onclick из примера выше сработает во всех 3 случаях.

[Luca]

ой, извиняюсь...
в 8 строке

if (  atrMap.has(i) && (div.getAttribute(i) === atrMap.get(i) ) ){

и получается 88 совпадений, но тем не менее.
227 свойств в обоих случаях

[Luca]

div.setAttribute('onclick', "alert('alert')");

не совсем так получается: в одном случае строка возвращается, в другом функция

[Luca]

в разных броузерах цифры разные. Если сравнить все свойства между броузерами, то, я так понимаю, localStorage надо, те запилить несколько Map, под каждый броузер и потом сравнить всё?