Você está aqui: JavaScript ::: DOM (Document Object Model) ::: document Object

JavaScript DOM - Como usar o objeto document em seus códigos JavaScript

Quantidade de visualizações: 7782 vezes
O objeto document representa a página HTML e fornece possibilidades para acessar, criar e manipular todos os elementos HTML no documento. Este objeto está logo abaixo do objeto window na hierarquia do DOM (Document Object Model), ou seja, podemos dizer que este elemento é filho do objeto window. Assim, para acessá-lo a partir de nossos códigos JavaScript podemos usar window.document ou simplesmente document. Veja:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<html>
<head>
<title>Estudos JavaScript</title>
</head>
<body>

<script type="text/javascript">
  // vamos obter o título desta página
  var titulo = window.document.title;

  // vamos exibir o resultado em uma mensagem alert
  window.alert("O título da página é: " + titulo);  
</script>

</body>
</html>


Neste exemplo nós usamos o objeto window para obter o objeto document. O passo seguinte foi obter o valor de sua propriedade title, que é usada para definir ou obter o título da página HTML.

Para obter um elemento em um documento HTML nós podemos usar as coleções (all, anchors, applets, etc), os métodos getElementById(), getElementsByName() e getElementsByTagName() e algumas outras propriedades e métodos. Se precisarmos acessar o elemento body ou html, podemos usar as propriedades document.documentElement e document.body.

Veja um trecho de código no qual acessamos o corpo do documento HTML e definimos sua cor de fundo:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<script type="text/javascript">
  // vamos definir a cor de fundo da página HTML
  window.document.body.bgColor = "Beige";  
</script>


Uma vez que o objeto document é um objeto contâiner para um documento HTML, ele fornece métodos para a crição de novos elementos (por meio do método createElement()), nós textos (createTextNode()) e nós de comentários (createComment()). Depois que um nó (node) é criado, ele pode ser inserido no documento por meio de chamadas aos métodos appendChild() e insertBefore().

Veja um trecho de código no qual usamos o método createElement() para criar um novo elemento div e logo em seguida usamos o método appendChild() para adicionar o elemento recém-criado no final do documento HTML:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<html>
<head>
<title>Estudos JavaScript</title>
</head>
<body>

<script type="text/javascript">
   // vamos criar um novo elemento div
   var elem = document.createElement("div");
   elem.innerHTML = "Sou uma div criada dinâmicamente";
   elem.style.backgroundColor = "beige";

   // vamos adicionar este novo elemento no final do documento
   document.body.appendChild(elem);
</script>

</body>
</html>

Os documentos HTML contidos em elementos frames e iframes possuem seus próprios objetos document. Para obter tais objetos, devemos usar a propriedade contentDocument.

Link para compartilhar na Internet ou com seus amigos:

JavaScript ::: Dicas & Truques ::: Tratamento de Erros

Como retornar o rastreio da pilha de um erro de tempo de execução em JavaScript usando a propriedade stack do objeto Error

Quantidade de visualizações: 7133 vezes
A propriedade stack do objeto Error da linguagem JavaScript pode ser usada quando queremos obter mais informações sobre as causas do aparecimento de um erro em tempo de execução. Dessa forma nós conseguimos rastrear o erro até a sua origem.

Veja um trecho de código JavaScript completo demonstrando o seu uso:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<!doctype html>
<html>
<head>
  <title>Estudos JavaScript</title>
</head>
<body>

<script language="javascript">
  // o trecho de código a seguir vai provocar
  // um erro de tempo de execução em JavaScript
  try{
    // y não foi definido
    var x = y;
  }
  catch(e){
    // mostra a pilha de rastreio do erro
    document.write("Rastreio da pilha: " + e.stack);
  } 
</script>
  
</body>
</html>

Ao executar este código JavaScript nós teremos o seguinte resultado:

Rastreio da pilha: ReferenceError: y is not defined at http://localhost/estudos/estudos_js.html:13:13


JavaScript ::: Dicas & Truques ::: Operadores de Manipulação de Bits (Bitwise Operators)

JavaScript Avançado - Como usar o operador de bits & (E/AND sobre bits) da linguagem JavaScript

Quantidade de visualizações: 1172 vezes
O operador de bits & (E/AND sobre bits) da linguagem JavaScript é usado quando queremos comparar os bits individuais de dois valores integrais (inteiros) e produzir um terceiro resultado. Os bits no resultado serão configurados como 1 se os bits correspondentes nos dois outros valores foram 1. Em caso contrário os bits são configurados como 0.

Para quem gosta de Lógica Matemática, ou a Tabela Verdade da Lógica de Boole, vai se lembrar do conectivo "^", que diz que a proposição resultante da conjunção só será verdadeira quando as proposições simples individuais forem verdadeiras. O operador de bits & do JavaScript é similar ao conectivo "^" da Lógica Proposicional.

Vamos analisar os seguintes valores binários:

a) 0101 (5 decimal)
b) 0100 (4 decimal)

Quando aplicamos o operador & nestes dois valores teremos o seguinte resultado:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

0101
0100
----
0100

Veja que o resultado é 0100, uma vez que apenas o segundo bit de cada valor está configurado como 1. Vamos ver isso em JavaScript agora. Observe o seguinte trecho de código:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<html>
<head>
  <title>Manipulação de Bits em JavaScript</title>
</head>
 
<body>

<script type="text/javascript">
  var a = 5;
  var b = 4;
  var c = a & b;
  
  // exibe o resultado (em binário e em decimal)
  document.writeln("a = " + obterBits(a) + " (" + a + ")");
  document.writeln("<br>b = " + obterBits(b) + " (" + b + ")");
  document.writeln("<br>a & b = " + obterBits(c) + " (" + c + ")");
  
  // função auxiliar que converte um decimal em sua representação em bits
  function obterBits(valor){
    var mascara = 1 << 31; // 10000000 00000000 00000000 00000000
    var buffer = ""; // um buffer para guardar os bits dos bytes
    
    for(var i = 1; i <= 32; i++){
      // compara os bits individuais dos dois valores inteiros
      if((valor & mascara) == 0){
    	buffer = buffer + "0";
      }
      else{
    	buffer = buffer + "1";
      }
      
      valor = valor << 1; // desloca uma posição para a esquerda
      // Cada troca à esquerda corresponde à multiplicação do
      // valor por 2
      
      if(i % 8 == 0){ // completou um byte?
        buffer = buffer + " ";
      }
    }
    
    return buffer;
  }
</script>

</body>
</html>


Ao executar este código teremos o seguinte resultado:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

    a = 00000000 00000000 00000000 00000101 (5) 
    b = 00000000 00000000 00000000 00000100 (4)
a & b = 00000000 00000000 00000000 00000100 (4)



JavaScript ::: Dicas & Truques ::: Matemática e Estatística

JavaScript para matemática - Como obter o maior entre dois ou mais valores numéricos usando a função max() do JavaScript

Quantidade de visualizações: 10720 vezes
A função max() do objeto Math da linguagem JavaScript pode ser usada quando temos dois ou mais valores numéricos e gostaríamos de retornar o maior deles. Note que esta função não aceita um vetor (array) como argumento, ou seja, os valores devem ser fornecidos de forma literal ou passados como variáveis independentes.

Veja o código JavaScript completo para o exemplo:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<html>
<head>
<title>Estudando JavaScript</title>
</head>
<body>

<script type="text/javascript">
  var n1 = 45;
  var n2 = 18;
  var maior = Math.max(n1, n2);
  document.write("O maior número é " + maior);
</script>
 
</body>
</html>

Ao executar este código nós teremos o seguinte resultado:

O maior número é 43

O retorno do método max() é um objeto Number representando o maior dos valores fornecidos. Se nenhum argumento for informado, o retorno será um objeto Infinity, enquanto um objeto NaN será retornado se algum dos valores fornecidos não for um valor numérico válido.


Vamos testar seus conhecimentos em

Domínios de Deformações

Para o dimensionamento de elementos de concreto armado sujeitos a solicitações normais, é necessário utilizar as relações de tensão-deformação (σ x ε) dos materiais (concreto e aço), as relações de compatibilidade de deformações e as relações de igualdade entre os esforços atuantes e os esforços resistentes.

Analise as informações a seguir a respeito das relações referenciadas:

I) As relações tensão-deformação referem-se ao comportamento do concreto simples.

II) As relações de compatibilidade de deformações são o resultado da hipótese de que as seções permanecem planas até a ruptura e dos domínios de deformação.

III) As relações de igualdade entre os esforços atuantes e os resistentes correspondem às equações de equilíbrio de forças e momentos em uma seção de concreto armado.

Assinale e alternativa correta:

A) Somente a afirmação I está correta.

B) Somente as afirmações II e III estão corretas.

C) Somente a afirmação II está correta.

D) Somente a afirmação III está correta.

E) Somente as afirmações I e II estão corretas.
Verificar Resposta Estudar Cards Todas as Questões

Vamos testar seus conhecimentos em Ética e Legislação Profissional

O exercício do direito à propriedade

Ainda sobre as ações judiciais correlatas aos direitos de vizinhança, mais especificamente sobre as ações de demarcação e divisão de propriedades, retificação de registros imobiliários e relação entre esses procedimentos, assinale a alternativa correta no que toca aos seus objetivos, às hipóteses de cabimento e às demais peculiaridades:

A) A ação de demarcação serve para esclarecer os limites divisórios entre dois prédios de dois proprietários diferentes.

B) O procedimento de retificação de matrícula serve para individualizar em matrículas separadas um bem que é de propriedade conjunta (condomínio).

C) A ação de demarcação dispensa memorial descritivo e prova pericial no processo.

D) As ações demarcatória e divisória não podem ser cumuladas na mesma ação, pois têm objetos diferentes.

E) Os procedimentos ou as ações de marcação e divisão de propriedades só podem ser realizados judicialmente.
Verificar Resposta Estudar Cards Todas as Questões

Vamos testar seus conhecimentos em AutoCAD Civil 3D

Survey Points e COGO Points

Survey points não podem ser movidos ou editados sem acessar a base de dados do levantamento e sem usar comandos especializados para a edição de pontos de levantamento.

A) Verdadeiro

B) Falso
Verificar Resposta Estudar Cards Todas as Questões

Vamos testar seus conhecimentos em Ética e Legislação Profissional

Princípios específicos do Direito do Consumidor

Assinale, abaixo, a única alternativa correta.

A) A informação não é direito básico do consumidor.

B) O reconhecimento da vulnerabilidade do consumidor é um dos princípios do Código de Defesa do Consumidor.

C) O Código de Defesa do Consumidor reconhece e dá tratamento isonômico ao consumidor e ao fornecedor.

D) O Código de Defesa do Consumidor é considerado lei geral, enquanto que o Código Civil lei especial.

E) É válida cláusula elaborada pelo fornecedor, onde expressamente impeça o consumidor, que venha a celebrá-lo, de reclamar seus direitos perante o Judiciário.
Verificar Resposta Estudar Cards Todas as Questões

Vamos testar seus conhecimentos em Ética e Legislação Profissional

Ética profissional, social, política

Se a maior preocupação de Maquiavel é o Estado, poderíamos dizer que isso o situa no presente temporal.

A respeito disto, afirma Sadek (1995, p. 17): "De fato, sua preocupação em todas as suas obras é o Estado. Não o melhor Estado, aquele tantas vezes imaginado, mas que nunca existiu. Mas o Estado real, capaz de impor a ordem".

A partir do trecho citado, assinale a alternativa correta:

A) Para Maquiavel, o tempo presente do Estado deve ser considerado pela ética.

B) Para Maquiavel, a ética está associada ao exercício da ordem.

C) Para Maquiavel, a ética está atrelada a uma idealização da ação na política.

D) Para Maquiavel, a ordem é fruto de um Estado ético.

E) Para Maquiavel, o Estado existe enquanto mantenedor da ética.
Verificar Resposta Estudar Cards Todas as Questões

Desafios, Exercícios e Algoritmos Resolvidos de JavaScript

Veja mais Dicas e truques de JavaScript

Dicas e truques de outras linguagens

Códigos Fonte

Programa de Gestão Financeira Controle de Contas a Pagar e a Receber com Cadastro de Clientes e FornecedoresSoftware de Gestão Financeira com código fonte em PHP, MySQL, Bootstrap, jQuery - Inclui cadastro de clientes, fornecedores e ticket de atendimento
Diga adeus às planilhas do Excel e tenha 100% de controle sobre suas contas a pagar e a receber, gestão de receitas e despesas, cadastro de clientes e fornecedores com fotos e histórico de atendimentos. Código fonte completo e funcional, com instruções para instalação e configuração do banco de dados MySQL. Fácil de modificar e adicionar novas funcionalidades. Clique aqui e saiba mais
Controle de Estoque completo com código fonte em PHP, MySQL, Bootstrap, jQuery - 100% funcional e fácil de modificar e implementar novas funcionalidadesControle de Estoque completo com código fonte em PHP, MySQL, Bootstrap, jQuery - 100% funcional e fácil de modificar e implementar novas funcionalidades
Tenha o seu próprio sistema de controle de estoque web. com cadastro de produtos, categorias, fornecedores, entradas e saídas de produtos, com relatórios por data, margem de lucro e muito mais. Código simples e fácil de modificar. Acompanha instruções para instalação e criação do banco de dados MySQL. Clique aqui e saiba mais

Linguagens Mais Populares

1º lugar: Java
2º lugar: Python
3º lugar: C#
4º lugar: PHP
5º lugar: Delphi
6º lugar: C
7º lugar: JavaScript
8º lugar: C++
9º lugar: VB.NET
10º lugar: Ruby



© 2024 Arquivo de Códigos - Todos os direitos reservados
Neste momento há 49 usuários muito felizes estudando em nosso site.