Show IDs in the page Fork

  • /*
     * @title Show IDs in the page
     * @description Show IDs of the elements in the current page.
     * @license CC0
     */
    
    
    var els = document.querySelectorAll ('[id], a[name]');
    for (var i = 0; i < els.length; i++) {
      var el = els[i];
      var id = el.id || el.name;
      var anchor = document.createElement ('a');
      anchor.href = '#' + encodeURIComponent (id);
      anchor.className = '___id_anchor';
      anchor.textContent = '#' + id;
      if (el.namespaceURI == "http://www.w3.org/1999/xhtml") {
        anchor.title = el.localName;
        if (el.localName.match (/^(?:h[1-6]|td|th|li|dt|dd|html)$/)) {
          el.insertBefore (anchor, el.firstChild);
          continue;
        }
      } else {
        anchor.title = '{' + el.namespaceURI + '}' + el.localName;
      }
      el.parentNode.insertBefore (anchor, el);
    }
    
    var style = document.createElement ('style');
    style.textContent = '.___id_anchor { display: inline !important; width: auto !important; height: auto !important; margin: 0 !important; border: none !important; padding: 0 !important; background-color: #ffa !important; color: black !important; font-size: 16px !important; font-weight: normal !important; font-family: monospace !important; line-height: 1.0 !important; text-decoration: underline !important }';
    document.head.appendChild (style);
    
  • Permalink
    このページへの個別リンクです。
    RAW
    書かれたコードへの直接のリンクです。
    Packed
    文字列が圧縮された書かれたコードへのリンクです。
    Userscript
    Greasemonkey 等で利用する場合の .user.js へのリンクです。
    Loader
    @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。
    Metadata
    コード中にコメントで @xxx と書かれたメタデータの JSON です。

History

  1. 2013/11/20 09:39:41 - 2013-11-20
  2. 2013/11/08 04:45:43 - 2013-11-08