 |
|
||||
Você está aqui: jQuery ::: Dicas & Truques ::: CSS (Cascading Style Sheet) |
Obtendo propriedades style de elementos HTMLQuantidade de visualizações: 8869 vezes |
|
Para acessar as propriedade style de um determinado elemento HTML, podemos usar códigos parecido com o que temos abaixo:
<script type="text/javascript">
<!--
function obterCSS(){
// obtém uma propriedade CSS da primeira DIV
var cor = $('#div_1').css('color');
// atribui o valor obtido à propriedade color da
// segunda DIV
$('#div_2').css('color', cor);
}
//-->
</script>
|
 Link para compartilhar na Internet ou com seus amigos: |
jQuery ::: Dicas & Truques ::: Manipulação e Conteúdo Dinâmico |
jQuery para iniciantes - Como obter valores de elementos de formulários HTML usando a função val() do jQueryQuantidade de visualizações: 8278 vezes |
|
Nesta dica eu mostro como podemos usar o método val() da biblioteca jQuery para obter o conteúdo dos elementos de formulários HTML. Veja, por exemplo, como obter o conteúdo de uma caixa de texto com o id "nome": ----------------------------------------------------------------------
Se precisar de ajuda para ajustar o código abaixo de acordo com as
suas necessidades, chama a gente no WhatsApp +55 (62) 98553-6711 (Osmar)
Ah, e se puder, faça uma DOAÇÃO de qualquer valor para nos ajudar
a manter o site livre de anúncios. Ficaremos eternamente gratos ;-)
Nosso PIX é: osmar@arquivodecodigos.com.br
----------------------------------------------------------------------
<script type="text/javascript">
<!--
function obterTexto(){
var texto = $('#nome').val();
window.alert(texto);
}
//-->
</script>
Lembre-se de que este método atuará apenas no primeiro da possível série de elementos retornados sob uma determinada condição. O retorno val() do jQuery é uma string. |
jQuery ::: Dicas & Truques ::: Atributos ou Propriedades HTML |
Apostila jQuery - Como substituir uma classe por outra em um elemento HTML usando os métodos removeClass() e addClass() do jQueryQuantidade de visualizações: 14130 vezes |
|
Muitos métodos do jQuery retornam um objeto jQuery que pode ser usado para fins de encadeamento de chamadas de métodos. Podemos tirar proveito disso para trocar as classes de um elemento HTML de forma bem simples. Sabemos que os métodos removeClass() e addClass() retornam um objeto jQuery. Assim, o trecho de código abaixo é perfeitamente válido: ----------------------------------------------------------------------
Se precisar de ajuda para ajustar o código abaixo de acordo com as
suas necessidades, chama a gente no WhatsApp +55 (62) 98553-6711 (Osmar)
Ah, e se puder, faça uma DOAÇÃO de qualquer valor para nos ajudar
a manter o site livre de anúncios. Ficaremos eternamente gratos ;-)
Nosso PIX é: osmar@arquivodecodigos.com.br
----------------------------------------------------------------------
<script type="text/javascript">
<!--
function trocarClasse(){
// troca a classe "destaque" do parágrafo
// com o id "parag" pela classe "destaque2"
$('#parag').removeClass("destaque")
.addClass("destaque2");
}
//-->
</script>
|
jQuery ::: Dicas & Truques ::: Atributos ou Propriedades HTML |
jQuery para iniciantes - Como ocultar e exibir um elemento HTML usando o método toggleClass() do jQueryQuantidade de visualizações: 13667 vezes |
|
O método toggleClass() do jQuery nos fornece uma forma bem simples de ocultar ou exibir um elemento HTML. Veja como isso é feito mais abaixo. Comece analisando o trecho de estilos CSS: ----------------------------------------------------------------------
Se precisar de ajuda para ajustar o código abaixo de acordo com as
suas necessidades, chama a gente no WhatsApp +55 (62) 98553-6711 (Osmar)
Ah, e se puder, faça uma DOAÇÃO de qualquer valor para nos ajudar
a manter o site livre de anúncios. Ficaremos eternamente gratos ;-)
Nosso PIX é: osmar@arquivodecodigos.com.br
----------------------------------------------------------------------
<style type="text/css">
body, td {font: 70% Verdana}
.oculta {display: none}
</style>
O truque aqui é adicionar a classe "oculta" ao elemento que queremos ocultar e removê-la quando queremos que o elemento seja exibido novamente. Veja o elemento DIV que usaremos para ilustrar o efeito: ---------------------------------------------------------------------- Se precisar de ajuda para ajustar o código abaixo de acordo com as suas necessidades, chama a gente no WhatsApp +55 (62) 98553-6711 (Osmar) Ah, e se puder, faça uma DOAÇÃO de qualquer valor para nos ajudar a manter o site livre de anúncios. Ficaremos eternamente gratos ;-) Nosso PIX é: osmar@arquivodecodigos.com.br ---------------------------------------------------------------------- <div id="div_1">Sou um DIV</div> E finalmente uma função JavaScript (na parte <head></head> da página) que poderá ser chamada a partir de um botão: ----------------------------------------------------------------------
Se precisar de ajuda para ajustar o código abaixo de acordo com as
suas necessidades, chama a gente no WhatsApp +55 (62) 98553-6711 (Osmar)
Ah, e se puder, faça uma DOAÇÃO de qualquer valor para nos ajudar
a manter o site livre de anúncios. Ficaremos eternamente gratos ;-)
Nosso PIX é: osmar@arquivodecodigos.com.br
----------------------------------------------------------------------
<script type="text/javascript">
<!--
function ocultarExibir(){
$("#div_1").toggleClass("oculta");
}
//-->
</script>
|
jQuery ::: Dicas & Truques ::: Manipulação e Conteúdo Dinâmico |
Como usar o método appendTo() do jQuery para adicionar todo o conteúdo de um elemento ao final de outro elemento HTMLQuantidade de visualizações: 456 vezes |
|
O método appendTo() é usado quando queremos adicionar todo o conteúdo dos elementos retornados sob uma determinada condição a outro ou outros elementos HTML. Veja um trecho de código no qual adicionamos o conteúdo de um parágrafo ao final de um elemento DIV: ----------------------------------------------------------------------
Se precisar de ajuda para ajustar o código abaixo de acordo com as
suas necessidades, chama a gente no WhatsApp +55 (62) 98553-6711 (Osmar)
Ah, e se puder, faça uma DOAÇÃO de qualquer valor para nos ajudar
a manter o site livre de anúncios. Ficaremos eternamente gratos ;-)
Nosso PIX é: osmar@arquivodecodigos.com.br
----------------------------------------------------------------------
<script type="text/javascript">
<!--
function adicionarConteudo(){
var texto = "<br>Mais uma linha.";
$("#parag").appendTo("#div_1");
}
//-->
</script>
O método appendTo() opera em todos os elementos HTML retornados sob uma determinação condição. O retorno do método é um objeto jQuery que pode ser usado para fins de encadeamento de chamadas de métodos. |
jQuery ::: Dicas & Truques ::: Manipulação e Conteúdo Dinâmico |
Como usar o método prependTo() do jQuery para adicionar todo o conteúdo de um elemento ao final de outro elemento HTMLQuantidade de visualizações: 7296 vezes |
|
O método prependTo() é usado quando queremos adicionar todo o conteúdo dos elementos retornados sob uma determinada condição no início de outro ou outros elementos HTML. Veja um trecho de código no qual adicionamos o conteúdo de um parágrafo no início de um elemento DIV: ----------------------------------------------------------------------
Se precisar de ajuda para ajustar o código abaixo de acordo com as
suas necessidades, chama a gente no WhatsApp +55 (62) 98553-6711 (Osmar)
Ah, e se puder, faça uma DOAÇÃO de qualquer valor para nos ajudar
a manter o site livre de anúncios. Ficaremos eternamente gratos ;-)
Nosso PIX é: osmar@arquivodecodigos.com.br
----------------------------------------------------------------------
<script type="text/javascript">
<!--
function adicionarConteudo(){
var texto = "Mais uma linha.<br>";
$("#parag").prependTo("#div_1");
}
//-->
</script>
O método prependTo() opera em todos os elementos HTML retornados sob uma determinação condição. O retorno do método é um objeto jQuery que pode ser usado para fins de encadeamento de chamadas de métodos. |
jQuery ::: Dicas & Truques ::: CSS (Cascading Style Sheet) |
Apostila jQuery - Como definir propriedades style CSS de elementos HTML usando a função css() do jQueryQuantidade de visualizações: 8523 vezes |
Para definir as propriedade style de um determinado elemento HTML só precisamos usar a função css() da biblioteca jQuery. Veja como isso pode ser feito no trecho de código abaixo:----------------------------------------------------------------------
Se precisar de ajuda para ajustar o código abaixo de acordo com as
suas necessidades, chama a gente no WhatsApp +55 (62) 98553-6711 (Osmar)
Ah, e se puder, faça uma DOAÇÃO de qualquer valor para nos ajudar
a manter o site livre de anúncios. Ficaremos eternamente gratos ;-)
Nosso PIX é: osmar@arquivodecodigos.com.br
----------------------------------------------------------------------
<script type="text/javascript">
<!--
function definirCSS(){
// define a cor verde para a propriedade CSS color da
// DIV com id "div_2"
$('#div_2').css('color', 'green');
}
//-->
</script>
Neste código a cor "green" é atribuída à propriedade CSS "color" do elemento DIV com o id "div_2". |
jQuery ::: Dicas & Truques ::: Manipulação e Conteúdo Dinâmico |
Como definir o conteúdo HTML de um elemento usando a função html() do jQueryQuantidade de visualizações: 7776 vezes |
O método html("conteúdo") permite definir o conteúdo (innerHTML) de todos os elementos encontrados em uma determinada condição. Considere os seguintes elementos P:---------------------------------------------------------------------- Se precisar de ajuda para ajustar o código abaixo de acordo com as suas necessidades, chama a gente no WhatsApp +55 (62) 98553-6711 (Osmar) Ah, e se puder, faça uma DOAÇÃO de qualquer valor para nos ajudar a manter o site livre de anúncios. Ficaremos eternamente gratos ;-) Nosso PIX é: osmar@arquivodecodigos.com.br ---------------------------------------------------------------------- <p>Sou o primeiro parágrafo</p> <p>Sou o segundo parágrafo</p> Veja agora o código JavaScript que define o conteúdo HTML destes dois parágrafos: ----------------------------------------------------------------------
Se precisar de ajuda para ajustar o código abaixo de acordo com as
suas necessidades, chama a gente no WhatsApp +55 (62) 98553-6711 (Osmar)
Ah, e se puder, faça uma DOAÇÃO de qualquer valor para nos ajudar
a manter o site livre de anúncios. Ficaremos eternamente gratos ;-)
Nosso PIX é: osmar@arquivodecodigos.com.br
----------------------------------------------------------------------
<script type="text/javascript">
<!--
function definirInnerHTML(){
var texto = "<b>Veja este texto</b>";
// define o conteúdo para os elementos P
$('p').html(texto);
}
//-->
</script>
Lembre, porém, que a prática mais comum é definir o conteúdo HTML de um elemento identificado por um id. O retorno deste método é um objeto jQuery, que pode ser usado para possíveis encadeamentos de chamadas de métodos. |
jQuery ::: Dicas & Truques ::: Atributos ou Propriedades HTML |
Como obter valores dos atributos de um elemento HTML usando a função attr() do jQueryQuantidade de visualizações: 15873 vezes |
O exemplo abaixo mostra como obter os valores dos atributos de um elemento HTML usando a notação attr(). O retorno é uma string contendo o valor do atributo:----------------------------------------------------------------------
Se precisar de ajuda para ajustar o código abaixo de acordo com as
suas necessidades, chama a gente no WhatsApp +55 (62) 98553-6711 (Osmar)
Ah, e se puder, faça uma DOAÇÃO de qualquer valor para nos ajudar
a manter o site livre de anúncios. Ficaremos eternamente gratos ;-)
Nosso PIX é: osmar@arquivodecodigos.com.br
----------------------------------------------------------------------
<script type="text/javascript">
<!--
function obterAtributo(){
// Este exemplo mostra como obter o valor do
// atributo value de uma caixa de texto com
// o id "nome"
var valor = $('#nome').attr("value");
window.alert(valor);
}
//-->
</script>
|
Vamos testar seus conhecimentos em Hidrologia |
| (Udesc 2016) "Por meio da interligação dos reservatórios por um canal, o chamado modelo de usina a fio d'água permitiu que Belo Monte ocupasse uma área 60% menor do que a prevista no projeto original. A mudança garantiu que nenhuma aldeia indígena próxima ao empreendimento fosse inundada e a hidrologia do rio ________________, preservada. A piracema também não foi comprometida, graças à colocação de escadas de peixes que preservam o equilíbrio da fauna aquática do rio." Disponível em http://www.brasil.gov.br/governo/2016/05/dilma-inaugura-usina-hidreletrica-de-belo-monte, acessado em agosto de 2016. O nome do rio que completa corretamente a lacuna do texto acima é: A) Xingu. B) Madeira. C) Teles Pires. D) Juruá. E) Guaporé. Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em Ética e Legislação Profissional |
| Responsabilidade civil no código de defesa do consumidor Um consumidor compra um ferro de passar roupa e quando está manejando o ferro pela primeira vez ele explode e o atinge, causando-lhe danos morais e estéticos. O consumidor é levado ao hospital para tratar alguns ferimentos. Nesse caso, a ação indenizatória deverá ser proposta em face do fabricante no prazo de: A) prazo decadencial de 5 anos. B) prazo prescricional de 30 dias. C) prazo decadencial de 90 dias. D) prazo prescricional de 5 anos. E) prazo prescricional de 90 dias. Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em Python |
| Qual é a forma correta de se retornar o primeiro caractere de uma string em Python? A) letra = "BRASIL".char(0) B) letra = "BRASIL"[0] C) letra = "BRASIL".substring(0, 1) D) letra = "BRASIL".sub(0, 1) E) letra = sub("BRASIL", 0, 1) Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em Fenômeno de Transportes e Hidráulica |
| Raio Hidráulico Ano: 2019 Banca: Instituto Consulplan Órgão: Prefeitura de Pitangueiras - SP Prova: Instituto Consulplan - 2019 - Prefeitura de Pitangueiras - SP - Engenheiro Civil O Raio Hidráulico é a relação entre a área molhada e o perímetro molhado, sendo parâmetro importante no dimensionamento de canais, tubos, dutos e outros componentes das obras hidráulicas. Sua unidade no SI é o metro (m2/m = m). Na figura é ilustrado um canal trapezoidal aberto (figura A), e à sua direita (figura B) as dimensões de sua seção transversal em um determinado trecho do seu percurso.  Para a seção transversal do canal, assinale, a seguir, o valor do raio hidráulico. A) 0,26 m. B) 0,47 m. C) 1,26 m. D) 2,12 m. Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em JavaScript |
Analise o seguinte código JavaScript
var a = new Array(1, 2, 3);
for (var i in a) {
window.alert("a[i] = " + a[i]);
}
Quantas vezes o diálogo alert será exibido? A) 3 vezes (uma vez para cada elemento do array). B) 4 vezes (uma vez para cada elemento e um alert adicional para a propriedade length do array). C) 3 ou 4 vezes, dependendo do navegador. D) O laço for...in não existe em JavaScript e vai provocar um erro. Verificar Resposta Estudar Cards Todas as Questões |
Veja mais Dicas e truques de jQuery |
Dicas e truques de outras linguagens |
E-Books em PDF |
||||
|
||||
|
||||
Linguagens Mais Populares |
||||
|
1º lugar: Java |
