MetaFilter highlight selected comment

On MetaFilter.com, adds a border to the selected comment to make it stand out visually, and adds "selected comment" to the small text to make it easy to search if you lose your place.

目前為 2019-08-09 提交的版本,檢視 最新版本

// ==UserScript==
// @name        MetaFilter highlight selected comment
// @version     3
// @grant       none
// @match       http://*.metafilter.com/*
// @match       https://*.metafilter.com/*
// @description On MetaFilter.com, adds a border to the selected comment to make it stand out visually, and adds "selected comment" to the small text to make it easy to search if you lose your place.
// @locale      en-us
// @namespace https://greasyfork.org/users/324881
// ==/UserScript==

function highlightSelectedComment() {
  // first, clear all borders when this function is called.
  let allCommentDivs = document.getElementsByClassName('comments');
  for (commentDiv of allCommentDivs) {
    commentDiv.style.outline = '';
    commentDiv.style.outlineOffset = '';
  }
  
  // then if there's a hash/fragment ID, highlight it.
  if(window.location.hash) {
    let fragment = window.location.hash.substring(1);
    let anchor = document.getElementsByName(fragment )[0];
    let divToHighlight = anchor.nextSibling;
    divToHighlight.style.outline = '.3em solid #9cc754';
    divToHighlight.style.outlineOffset = '.3em';
    divToHighlight.lastChild.innerHTML += 'Selected comment';
  }
}

// Attach event listeners

highlightSelectedComment(); // In case this script runs after the window load event, highlight as soon as Greasemonkey runs the script.
window.addEventListener('load',highlightSelectedComment); // In case this script runs before the window load event, highlight when that event fires.
window.addEventListener('hashchange',highlightSelectedComment); // Run every time the hash changes.