ES7 bindings

dom.js

function first() {
  if(!this.length) {
    return this[0]
  }
  throw new Error("empty list")
}

export default Array.prototype

export function $(selector, root = document) {
  return Array.from(root.querySelectorAll(selector))
}

export function getAttribute(attributeName) {
  return this::first().getAttribute(attributeName)
}

export function setAttribute(attributeName, value) {
  this.forEach((item) => {
    item.setAttribute(attributeName, value)
  })
  return this
}

export function setProperties(properties) {
  this.forEach((item) => {
    Object.assign(item, properties)
  })
  return this
}

export function getProperty(property) {
  return this::first()[attributeName]
}

export function setInnerHTML(string) {
  this.forEach((item) => {
    item.innerHTML = string
  })
  return this
}

export function remove() {
  this.forEach((item) => {
    const parent = item.parentNode
    if(parent) {
      parent.removeChild(item)
    }
  })
  return this
}

example.js

import {$, setAttribute, setInnerHTML} from "./dom"

$("div")
  ::setAttribute("data-foo", "bar")
  ::setInnerHTML("hey")