Você está aqui: 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 ::: Manipulação e Conteúdo Dinâmico |
Como usar a função text() do jQuery para obter o conteúdo de um elemento HTML desconsiderando as tagsQuantidade de visualizações: 10038 vezes |
Enquanto o método html() nos permite obter o conteúdo de um elemento HTML incluindo as tags, o método text() permite a mesma operação, porém, desconsiderando quaisquer tags HTML que forem encontradas. Considere o elemento DIV a seguir:---------------------------------------------------------------------- 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"> <button>Clique Aqui</button> </div> Veja agora o código JavaScript que obtém o conteúdo entre as tags <div> e </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 obterTexto(){ var texto = $('#div_1').text(); window.alert(texto); } //--> </script> Veja que enquato o método html() retorna a string "<button>Clique Aqui</button>", o método text() retorna apenas "Clique Aqui". Observe também que o método text() atuará em todos os elementos retornados em uma determinada condição. O retorno deste método é uma string. |
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 ::: Manipulação e Conteúdo Dinâmico |
jQuery para iniciantes - Como obter o conteúdo de um elemento HTML usando a função html() do jQueryQuantidade de visualizações: 9403 vezes |
O método html() da biblioteca jQuery nos permite obter o conteúdo (a propriedade innerHTML) do primeiro da série de elementos encontrados. Considere o seguinte 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 ---------------------------------------------------------------------- <div id="div_1"> <button>Clique Aqui</button> </div> Veja agora o código JavaScript que obtém todo o conteúdo HTML entre as tags <div> e </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 ---------------------------------------------------------------------- <!doctype html> <html> <head> <title>Estudos jQuery</title> </head> <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script> <body> <div id="div_1"> <button>Clique Aqui</button> </div> <script type="text/javascript"> var html = $("#div_1").html(); window.alert("O conteúdo HTML da tag DIV é: " + html); </script> </body> </html> Ao abrir esta página HTML você terá um resultado parecido com: O conteúdo HTML da tag DIV é: <button>Clique Aqui</button>. Esta dica foi revisada e testada no jQuery 3.6.0. |
jQuery ::: Dicas & Truques ::: Manipulação e Conteúdo Dinâmico |
Como definir o conteúdo de um elemento HTML usando o método text() do jQueryQuantidade de visualizações: 7233 vezes |
O método text("conteudo") nos permite definir o conteúdo de um elemento HTML de forma muito simplificada. Veja um trecho de código que define o conteúdo de uma DIV com o id "div_1": ---------------------------------------------------------------------- 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 definirTexto(){ var texto = "Veja este texto"; // Define o texto para o elemento DIV $('#div_1').text(texto); } //--> </script> Lembre-se de que este método atuará em todos os elementos retornados sob uma determinada condição. Observe ainda que este método substitui "<" e ">" por "<" e ">". 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 o valor da propriedade class CSS de um elemento HTML usando jQueryQuantidade de visualizações: 11340 vezes |
Em algumas situações nós precisamos obter o valor da propriedade class de um elemento HTML. O trecho de código abaixo mostra como isso pode ser feito usando a função attr() da biblioteca jQuery:---------------------------------------------------------------------- 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 obterNomeClasse(){ // Este exemplo mostra como obter o nome de classe // de um elemento HTML com o id "div_1" var nomeClasse = $('#div_1').attr("className"); window.alert(nomeClasse); } //--> </script> |
jQuery ::: Dicas & Truques ::: Manipulação e Conteúdo Dinâmico |
Como adicionar conteúdo ao final de um elemento HTML usando a função append() do jQueryQuantidade de visualizações: 821 vezes |
O método append() permite adicionar conteúdo ao final de um elemento HTML. Este conteúdo pode ser um seletor, um elemento HTML, uma string HTML ou um objeto jQuery. Veja um trecho de código no qual adicionamos mais um linha de texto a um parágrafo: ---------------------------------------------------------------------- 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").append(texto); } //--> </script> O método append() 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 adicionar conteúdo ao início de um elemento HTML usando a função prepend() do jQueryQuantidade de visualizações: 510 vezes |
O método prepend() permite adicionar conteúdo ao início de um elemento HTML. Este conteúdo pode ser um seletor, um elemento HTML, uma string HTML ou um objeto jQuery. Veja um trecho de código no qual adicionamos uma linha de texto no início de um parágrafo: ---------------------------------------------------------------------- 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").prepend(texto); } //--> </script> O método prepend() 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 ::: 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> |
Vamos testar seus conhecimentos em Engenharia Civil - Instalações Hidráulicas Prediais |
Sistema domiciliar de abastecimento de água Se alguém mergulha numa piscina, a água exerce uma pressão sobre o corpo. Da mesma forma, a água exerce uma pressão sobre outros fluidos ou sobre uma superfície. Essa pressão não depende do volume de água contido em determinado recipiente, mas da altura do nível da água. Assim, ao se dimensionar as tubulações, deve-se considerar as pressões máximas e mínimas que serão suportadas pelas tubulações. Dessa forma, a pressão máxima que a instalação de água fria pode apresentar durante o funcionamento dos aparelhos é: Selecione a resposta: A) 0,5mca. B) 60mca. C) 20mca. D) 40mca. E) 5mca. Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em Hidrologia |
Qual dos rios, entre os listados abaixo, não está localizado no território brasileiro? A) Rio São Francisco. B) Rio Tocantins. C) Rio Orinoco. D) Rio Araguaia. E) Rio Paraíba do Sul. Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em |
Cisalhamento e detalhamento de vigas A NBR 6118 (ABNT, 2014) determina que todos os elementos lineares submetidos à força cortante devem conter armadura transversal mínima (ρSW) constituída por estribos. Nesse contexo, marque a alternativa correta: A) O diâmetro da barra que constitui o estribo não pode exceder 20% da menor largura da viga. B) O diâmetro da barra que constitui o estribo deve ser exatamente de 5mm ou menor. C) Nos estribos em que as barras são lisas, o diâmetro não pode ser superior a 10mm. D) O espaçamento máximo entre as barras transversais dos estribos não deve ser superior a 20cm. E) O espaçamento mínimo adequado dos estribos deve ser aquele que permita a introdução do vibrador. Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em Ética e Legislação Profissional |
A responsabilidade moral A ética leva o homem a questionar constantemente suas ações e as atitudes alheias, tentando definir se elas são boas ou más, corretas ou incorretas. Na condição de disciplina, essa ciência se preocupa com a análise das ideias que envolvem a produção do bem e do mal, ou seja, dedica-se aos seus aspectos teóricos. Em tal perspectiva, pode-se afirmar que o conceito de ética se refere a: A) quando o ser humano não pode falhar. B) um conjunto de conhecimentos extraídos dos meios de comunicação. C) um conjunto de conhecimentos extraídos da investigação do comportamento humano. D) um conjunto de conhecimentos extraídos da investigação da moral. E) quando o ser humano falha. Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em Engenharia Civil - Construção Civil |
Processos e técnicas construtivas de instalações elétricas e hidráulicas As instalações prediais de água fria têm a função de distribuir água potável em temperatura ambiente, enquanto as instalações prediais de água quente distribuem água aquecida, sempre observando a segurança dos usuários. Analise as afirmativas a seguir, referentes às instalações prediais de água fria e água quente. I. As colunas de distribuição têm a função de conduzir a água a partir dos barriletes com destino aos ramais, tanto na instalação de água fria quanto na instalação de água quente. II. Os aquecedores de acumulação se caracterizam pela capacidade de armazenamento de água, que é aquecida em um reservatório componente do equipamento. III. O sistema de aquecimento individual, em uma edificação, consiste naquele que alimenta todos os pontos de utilização de um único apartamento. IV. As bitolas das tubulações empregadas em uma rede de distribuição de água devem diminuir a partir do barrilete em direção ao sub-ramal. Assinale a alternativa que apresenta somente a(s) afirmativa(s) correta(s). A) Apenas a afirmativa I está correta. B) Apenas a afirmativa III está correta. C) Apenas as afirmativas II e III estão corretas. D) Apenas as afirmativas I, II e IV estão corretas. E) As afirmativas I, II, III e IV estão corretas. 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 |