TIL 2020.11.11

Rule of 72 Definition

• to find how many years will take to make money double
• reference: https://www.investopedia.com/terms/r/ruleof72.asp

---

JavaScript decimal places limit

toFixed( )

var num = 5.56789;
var n = num.toFixed(2); // 5.57

Recurrence Relation

• allows you to find square root over Math.sqrt()

• reference: https://suhak.tistory.com/228

---

DOM(Document Object Model)

• programming interface that can modify and manipulate html document like JavaScript Object
• other languages has DOM as well
• html code itself is not DOM but html code that you can open and manipulate in console log on browser is DOM
• represents HTML as a tree structure of tags.
• use ‘console.dir’ to show DOM

Node

• the generic name for any type of object in the DOM hierarch

Element

• one specific type of node and can be directly specified in the HTML with an HTML tag and can have properties like an id or class
• node > element

---

Method

ParentNode.append()

• inserts after the last child of the ParentNode.
• append DOMString objects
• has no return value
• can append several nodes and strings

ParentNode.appendChild()

• put tag inside tag and tag will be moved with its node well, not clone. Only accepts Node objects
• only accepts Node objects.
• returns the appended Node object.
• can only append one node.

ParentNode.prepend():

• similar to append but it will insert before the first child node

QuerySelectorAll()

• returns all the elements
• parentNode can be document and other tag as well as long as you call from html

QuerySelector()

• returns the first element

ChildNode.remove()

• only needs a reference to the child so making simpler to remove an element without having to look for the parent node

 

removeChild()

• needs a reference both to the parent and the child

• Remove Everything
  const container = document.querySelector('#container');
  while (container.firstChild) {
    container.removeChild(container.firstChild);
  }
   
  Remove with Restriction
  const container = document.querySelector('#container');
  while (container.children.length > 1) {
    container.removeChild(container.lastChild);
  }
  const tweets = document.querySelectorAll('.tweet')
  tweets.forEach(function(tweet){
      tweet.remove();
  })
  // or
  for (let tweet of tweets){
      tweet.remove()
  }

Properties

classList

• add class

oneDiv.classList.add('tweet')

textContent

oneDiv.textContent = 'dev'

innerHTML

• has security issue so better to use textContent
• reference: https://medium.com/@jenlindner22/the-risk-of-innerhtml-3981253fe217#:~:text=innerHTML%20today%20is%20cross%2Dsite,cookies%20and%20other%20personal%20information.

---

How to convert nodelist into javascript array

reference: https://gomakethings.com/converting-a-nodelist-to-an-array-with-vanilla-javascript/