swap stylesheet via <select> and save choice in storage

useColor.js

!function() {
  var handle = "useColor";
  var storage = window.sessionStorage;
  var href = storage && storage.getItem(handle) || "";
  var control = document.getElementById(handle);
  if (!control) throw new Error("Unused code.");
  var head = document.head;
  var link = document.createElement("link");
  link.rel = "stylesheet";
  control.value = link.href = href;
  control.addEventListener("change", function() {
    href = control.value;
    load(href);
    if (storage) storage.setItem(handle, href);
  });
  load(href);

  function load(href) {
    var isNone = !href;
    var inHead = link.parentNode === head;
    if (isNone) {
      link.removeAttribute("href");
      inHead && head.removeChild(link);
    } else {
      link.href = href;
      inHead || head.appendChild(link);
    }
  }
}();

useColor.md

<label class="preset-box block-table mt1">
  <code class="mr1">color</code>
  <select id="useColor" class="shadow-ring">
    <option value>none</option>
    <option value="../color/main.css?" data-hidden="local">local</option>
    <option value=".............../color/master/main.css?">VPN</option>
  </select>
</label>