 |
|
Você está aqui: JavaScript ::: Dicas & Truques ::: Formatação de datas, strings e números |
Como formatar um número de acordo com as configurações do sistemaQuantidade de visualizações: 13898 vezes |
<script language="javascript">
<!--
var valor = 4297.96;
var res = valor.toLocaleString();
document.write("Resultado: " + res);
//-->
</script>
|
 Link para compartilhar na Internet ou com seus amigos: |
JavaScript ::: Dicas & Truques ::: Formulários |
Formulários HTML - Como marcar ou desmarcar todas as checkboxes de um formulário HTML de uma só vez usando JavaScriptQuantidade de visualizações: 18337 vezes |
|
Nesta dica mostrarei como é possível clicar em um botão (pode ser um link também) e chamar uma função JavaScript que marca ou desmarca todos os elementos HTML checkbox de uma só vez. Para isso usaremos o método getElementsByName() para retornar todas as checkbox e em seguida manipular sua propriedade checked. Veja a imagem abaixo:  E agora o código HTML e JavaScript completo: ----------------------------------------------------------------------
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>
<form name="teste">
<input type="checkbox" name="linguagem">Java
<input type="checkbox" name="linguagem">Delphi
<input type="checkbox" name="linguagem">C++
</form>
<a href="javascript:marcar()">Marcar Todas</a> |
<a href="javascript:desmarcar()">Desmarcar Todas</a>
<script language="JavaScript">
function marcar(){
var boxes = document.getElementsByName("linguagem");
for(var i = 0; i < boxes.length; i++)
boxes[i].checked = true;
}
function desmarcar(){
var boxes = document.getElementsByName("linguagem");
for(var i = 0; i < boxes.length; i++)
boxes[i].checked = false;
}
</script>
</body>
</html>
|
JavaScript ::: DOM (Document Object Model) ::: Eventos JavaScript + DOM (Document Object Model) |
Como usar o evento DOMContentLoaded para verificar se o DOM (Document Object Model) já está disponível para manipulação via JavaScriptQuantidade de visualizações: 2183 vezes |
|
Em algumas situações nós precisamos iniciar a manipulação dos elementos de uma página HTML a partir de nossos códigos JavaScript mas não sabemos com certeza se os elementos do DOM (Document Object Model) já estão disponíveis para acesso. Para essas situações nós podemos usar o evento DOMContentLoaded, que é disparado quando todo o conteúdo DOM já estiver carregado, mesmo que imagens e folhas de estilo CSS ainda estejam pendentes de carregamento. Vamos ver um exemplo? Considere o código JavaScript abaixo (incluindo o código HTML): ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<html>
<head>
<title>Estudos PHP</title>
<script type="text/javascript">
// vamos obter uma referência ao elemento DIV
var divElem = document.getElementById("m_div");
// vamos a cor do texto da DIV
divElem.style.color = 'blue';
</script>
</head>
<body>
<div id="m_div">Sou um elemento DIV</div>
</body>
</html>
Veja que temos um elemento DIV na parte <body> do página e, na parte <head> temos um código JavaScript que tenta alterar a cor do texto da DIV. Como já era de se esperar, ao abrirmos este documento HTM no navegador, teremos o seguinte erro: Uncaught TypeError: Cannot read property 'style' of null at index.html:9 Isso aconteceu porque o código JavaScript foi executado antes que o elemento DIV fosse inserido no DOM da página. Para evitar isso, só precisamos usar o evento DOMContentLoaded. Veja a nova versão do código: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<html>
<head>
<title>Estudos PHP</title>
<script type="text/javascript">
// vamos tratar o evento DOMContentLoaded
document.addEventListener('DOMContentLoaded', function(e){
// vamos obter uma referência ao elemento DIV
var divElem = document.getElementById("m_div");
// vamos a cor do texto da DIV
divElem.style.color = 'blue';
});
</script>
</head>
<body>
<div id="m_div">Sou um elemento DIV</div>
</body>
</html>
Agora execute o exemplo novamente e veja como o texto do elemento DIV é colorido de azul, uma boa indicação de que o evento DOMContentLoaded foi disparado com sucesso. Note ainda como usamos o método addEventListener() do objeto document para fazer a associação do evento. |
JavaScript ::: Dicas & Truques ::: Recursão (Recursividade) |
JavaScript Avançado - Como remover todas as ocorrências de uma substring em uma string usando uma função recursivaQuantidade de visualizações: 179 vezes |
|
Esta dica contém um ótimo exercício de recursão. Trata-se de uma função JavaScript recursiva para remover todas as ocorrências de uma substring em uma string. Analise o código cuidadosamente e você conseguirá desenvolver várias funções de recursividade a partir dele. Veja o código JavaScript completo: ----------------------------------------------------------------------
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">
// função recursiva que remove todas as ocorrências
// de uma substring em uma string
function remover(string, substring){
// primeiro obtemos o índice da substring
// dentro da string
var indice = string.indexOf(substring);
var resultado = "";
// interromper a recursividade?
if(indice == -1){
return string;
}
else{
resultado += string.substring(0, indice) +
remover(string.substring(indice + substring.length),
substring);
}
return resultado;
}
// hora de testar a função recursiva
var frase = "Ontem comprei duas camisas e uma calça";
document.writeln("Original: " + frase);
frase = remover(frase, "duas");
document.writeln("<br>Nova frase: " + frase);
</script>
</body>
</html>
Ao executar este código nós teremos o seguinte resultado: Original: Ontem comprei duas camisas e uma calça Nova frase: Ontem comprei camisas e uma calça |
Desafios, Exercícios e Algoritmos Resolvidos de JavaScript |
Veja mais Dicas e truques de JavaScript |
Dicas e truques de outras linguagens |
Códigos Fonte |
 Software de Gestão Financeira com código fonte em PHP, MySQL, Bootstrap, jQuery - Inclui cadastro de clientes, fornecedores e ticket de atendimentoDiga 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 funcionalidadesTenha 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 |
