leodotng
8/30/2017 - 2:59 AM

DOM functions&Solutions created by leodotng - https://repl.it/K6xd/0

DOM functions&Solutions created by leodotng - https://repl.it/K6xd/0

// Define a function named getTextById
// The function should accept 1 parameter: id
// The function should select the element with the given id
// The function should return the element's textContent
function getTextById (id) {
  let el = document.getElementById(id);
  return el.innerText;
}

// Define a function named setTextById
// The function should accept 2 parameters: id and text
// The function should select the element with the given id
// The function should set the element's textContent to be the given text
function setTextById (id, text) {
  let el = document.getElementById(id);
  el.innerText = text;
}

// Define a function named getTextByClassName
// The function should accept 1 parameter: className
// The function should select the element with the given className
// Assume there is only 1 element with the given className on the page
// The function should return the element's textContent
function getTextByClassName (className) {
  var el = document.getElementsByClassName(className);
  return el[0].textContent;
}

// Define a function named setTextByClassName
// The function should accept 2 parameters: className and text
// The function should select the element with the given className
// Assume there is only 1 element with the given className on the page
// The function should set the element's textContent to be the given text
function setTextByClassName (className, text) {
  var el = document.getElementsByClassName(className)
  el[0].textContent = text;
}

// Define a function named addClassById
// The function should accept 2 parameters: id and className
// The function should select the element with the given id
// Assume there is only 1 element with the given className on the page
// The function should add the given class to the elements classList
function addClassById (id, className) {
  var el = document.getElementById(id)
  el.className = className
}

// Define a function named getValueByName
// The function should accept 1 parameter: name
// The function should select the element with the given name
// Assume there is only 1 element with the given name on the page
// The function should return the element's value
function getValueByName (name) {
  var el = document.getElementsByName(name)
  return el[0].value
}

// Define a function named setValueByName
// The function should accept 2 parameters: name and value
// The function should select the element with the given name
// Assume there is only 1 element with the given name on the page
// The function should set the element's value to be the given value
function setValueByName (name, value) {
  var el = document.getElementsByName(name)
  el[0].value = value

}

// Define a function named hideByClassName
// The function should accept 1 parameter: className
// The function should set the display property to 'none' on all elements with the given className
function hideByClassName (className) {
  var el = document.getElementsByClassName(className)
  for (var i = 0; i < el.length; i++) {
    el[i].style.display = 'none';
  }
}

// Define a function named setStyleByClassName
// The function should accept 3 parameters: className, styleProperty and value
// The function should set the given style property to the given value on all elements with the given className
function setStyleByClassName (className, styleProperty, value) {
  var el = document.getElementsByClassName(className)
  for (var i = 0; i < el.length; i++) {
    el[i].style[styleProperty] = value;
  }
}