Tips: Highlighting common thing that come up
Recent blogs I have been enjoying
The Independent Web or Indie Web movement has made reading blogs much more enjoyable. So I though I would put a quick list of some less know web site that I have been visiting to read up on things.
- Rob Owen
Developer, designer and linguist
- Evan Sheehan
Designer and builder
- Mészáros Róbert
Full-stack developer
- Sean C Davis
Writer, teacher, speaker, and consulter
These blogs are especially revealing to see what I would call the craftsman/craftswoman/craftsthem era of web design taking shape.
querySelector vs getElementByClassName
When you reference DOM elements using document.querySelector*
it doesn't reference elements that were dynamically added to the DOM by JavaScript. Using getElements*
calls live collections, and querySelectorAll
returns a static collection.
Visualize JSON data
To help visualize JSON data use the JSON Crack tool to generates graph diagrams from JSON objects.
:target CSS pseudo-class
This is a interesting one. :target
will select and element or div that has the same ID as the URL's hash. So if you have a div with the ID of haber-dasher
and you have an anchor with the href="#haber-dasher
then when you click the link and add #haber-dasher to the end of the URl like someurl.com/#haber-dasher
the class :target
will add blue to the h2 like this.
h2:target {
color: blue;
}
We can use this to let the user know they are in a specific part of the document for this like drop anchors or tabs.