JavaScript Básico

JavaScript

Capturar elementos de uma página utilizando JavaScript

A partir dos elementos DOM da página é possível manipular os elementos do HTML com o JavaScript.

// Get element by id
var myElement = document.getElementById('abc');

// Get all nodes that item elements
//makes an array
var myElement = document.getElementByTag('li');

// Restricting elements to retrieve data
var myListItems = document.getElementsByTagName('li');
var myFirstList = document.getelementById('abc');
var limitedList = myFirstList.getElementsByTagName('li');

Eventos em JavaScript

Qualquer ação do usuário pode ser um evento em JavaScript: um mouseover em determinada imagem, os cliques etc. Por isso, é mais fácil criar os handlers para estes eventos, isto é, as respostas a determinadas ações.

// Event handler
myelement.onclick = function() {
 // 
 // your event handler code
 //
};

// Drawback in JS: IE 8 and previous don't understand
document.addEventListener('click', myFunction, false);

innerHTML

// innerHTML gets text inside tags
innerHTML allows to change text inside text
//JavaScript
document.getElementById('myAnchor').innerHTML

1. create the element
2. add it to the document

//creating elements
var myNewElement = document.createElement("li");
myElement.appendChild(my)

// working with forms
document.forms.frmContact
document.forms.frmContact.name

// applying styles to CSS
#exemple {
width: 230px;
fonte-weight: bold;
}

myElement.style.width = "230px";
myElement.style.fontWeight = "bold"; //camelCase

stting the class:
myElement.className = "";

Return em JavaScript

O return tem duas funções muito simples e úteis:
1- Retornar um valor quando a função é declarada.

function returnValue() {
   var a = 5;
   return a;
}

2- Interromper a execução do script (pra isso basta deixar o return;). Neste caso, não é necessário retornar nenhum valor, como no caso abaixo:

function returnValue() {
   var a;
   if(a != null){
       return;
   }
   a = 5;
   return a;
}

jQuery

Vantagens e desvantagens do jQuery em relação ao JavaScript

Vantagens

  • Validação feita em todos os browsers: o código funcionará em todos os navegadores em todas as versões.
  • Sintaxe mais simples e prática: para utilizar uma classe, basta declarar $(“nome_da_classe”).
// jQuery
$( "div.demo-container" ).html();

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.