jmlavoier

const content = document.querySelector('.content');
const input = document.querySelector('input');
const div = document.createElement('DIV');

// Insere um span dentro da div
div.innerHTML = '<span>Dentro </span>';
console.log(div); //<div><span>Dentro </span></div>

// Insere a div na ultima posição da div.content
content.appendChild(div);

jmlavoier

const input = document.querySelector('input');
const content = document.querySelector('.content');

// Pegando atributo
const inputName = input.getAttribute('name');
console.log(inputName); // nome

// Setando atributo
input.setAttribute('maxlength', 20);

jmlavoier

const p = document.querySelector('.p1');
const colors = ['red', 'blue', 'yellow', 'green', 'black'];
let index = 0;

const changeColor = function (event) {
  event.target.style.color = colors[index];
  index = index < 4 ? index + 1 : 0;
}

// Diretamente do método do elemento

jmlavoier

const allP = document.getElementsByTagName('p');

// Criando a função de callback
// Todos os eventos recebem como parâmetro o objeto event
// que permite pegarmos o elemento clicado event.target, 
// e realizar outras funcionalidades.
const goToLastPosition = function (event) {
   event.target.parentNode.appendChild(event.target);
}

jmlavoier

const p = document.querySelector('.p1');
const content = document.querySelector('.content')
const colors = ['red', 'blue', 'yellow', 'green', 'black'];
let index = 0;

// Repare que aqui foi utilizado o currentTarget,
// isso para pegar o elemento atual que esta chamando
// a função, porque o target retorna somente o elemento clicado.
// Caso você queira que o evento não se propague para o elemento
// pai use o event.stopPropagation() que vou deixar comentado

jmlavoier

const content = document.querySelector('.content')
const colors = ['red', 'blue', 'yellow', 'green', 'black'];
let index = 0;

const changeColor = function (event) {
  if (event.target && event.target.tagName === 'P') {
    event.target.style.color = colors[index];
    index = index < 4 ? index + 1 : 0;
  }
}

jmlavoier

const content = document.querySelector('.content')
const colors = ['red', 'blue', 'yellow', 'green', 'black'];
let index = 0;

// Sintaxe ES6 
const eventDelegate = (tagName, callback) => event => {
  if (event.target && event.target.tagName === tagName) {
    return callback(event);
  }
}

jmlavoier

function get_branches {
	#The environment path
	ENV="~/Sites/env"

	#The repositories inside the ENV
    envb=$(eval "cd $ENV" &&  git rev-parse --abbrev-ref HEAD)
    uibr=$(eval "cd $ENV/ui" &&  git rev-parse --abbrev-ref HEAD)
    appb=$(eval "cd $ENV/app" &&  git rev-parse --abbrev-ref HEAD)

    #Colors

jmlavoier

const counter = (state = 0, action) => {
  switch (action.type) {
    case 'INCREMENT':
      return state + 1;
    case 'DECREMENT': 
      return state - 1;
    default:
      return state;
  }
}

jmlavoier

const counter = (state = 0, action) => {
  switch (action.type) {
    case 'INCREMENT':
      return state + 1;
    case 'DECREMENT': 
      return state - 1;
    default:
      return state;
  }
}