「1 分钟学 DOM 基础操作」添加和移除元素样式、添加至元素内、添加和移除事件、计算鼠标相对元素的位置

ele.classList.add('class-name');

// Add multiple classes (Not supported in IE 11)
ele.classList.add('another', 'class', 'name');

ele.classList.remove('class-name');

// Remove multiple classes (Not supported in IE 11)
ele.classList.remove('another', 'class', 'name');

ele.classList.toggle('class-name');

target.appendChild(ele);

ele.onclick = function() {
    ...
};

// Remove the event handler
delete ele.onclick;

const handler = function() {
    ...
};

// Attach handler to the `click` event
ele.addEventListener('click', handler);

// Detach the handler from the `click` event
ele.removeEventListener('click', handler);

ele.addEventListener('mousedown', function (e) {
    // Get the target
    const target = e.target;

    // Get the bounding rectangle of target
    const rect = target.getBoundingClientRect();

    // Mouse position
    const x = e.clientX - rect.left;
    const y = e.clientY - rect.top;
});