Home
índice
Página anterior

"As críticas não nos ajudam em nada. Dão apenas a visão da incapacidade que se aceitarmos, nos incapacitarão ainda mais."

Clicar para Executar jQuery

Manipulação de Conteúdos

Na seção de manipulação da documentação da biblioteca jQuery Manipulation existe várias funções para manipulação de atributos, classes, elementos Dom, do documento html.

• html();

Essa função recupera um conteúdo html, permite incluir um conteúdo no formato string. Esse conteúdo pode ser um texto simples ou pode conter tags html, que serão renderizados como html.

• Recuperando um parágrafo

No javaScript:
$(document).ready(function(){
$("span").click(function(){
alert($("p").html());
});
});
Resultado: //a janela de alerta apresenta o texto dentro de p

• Alterando o Valor do Conteúdo

No javaScript:
$(document).ready(function(){
$("span").click(function(){
$("p").html("Escritora indiana Shri")
});
});
Resultado: //ao clicar em (para executar jQuery) aparece a frase: Escritora indiana Shri

Obs; Pode-se colocar tags html dentro dos parênteses.
No javaScript:
$(document).ready(function(){
$("span").click(function(){
$("p").html("<h1>Escritora indiana Shri</h1>")
});
});
Resultado:  //ao clicar em (para executar jQuery) a fonte do texto aumenta

• text();

A função text, recupera o conteúdo do formato texto, permitindo incluir conteúdo em um elemento. Nesse exemplo as tags não são renderizadas, ou interpretadas como conteúdo html e sim como texto.

• Interpretando o Conteúdo como Texto

No javaScript:
    $(document).ready(function(){
$("span").click(function(){
    $("div").text("<h1>Escritora indiana Shri</h1>");
    alert($("div").text());
	});
	});

• Interpretando o Conteúdo como Html

Para que a interpretação como tags aconteça é necessário colocar html.

No javaScript:
    $(document).ready(function(){
$("span").click(function(){
    $("div").html("<h1>Escritora indiana Shri</h1>");
    });
});

• Inserindo Texto dentro de uma Div

No javaScript:	
     $(document).ready(function(){
 $("span").click(function(){
     $("div").text ($("p").html());
    });
});	

• val();

Equivale a value, função value de um elemento input que retorna o valor de uma textarea ou inputText. A função textarea recupera o valor de dentro de um formulário. Bastante usada para validar formulários. Para verificação de valores, se determinado campo foi preenchido ou não. Ela recupera totalmente o código html inserido dentro do formulário.

• Inserindo Texto dentro de uma Div

No javaScript:
$(document).ready(function(){
$("span").click(function(){
  alert($("textarea").val());
  });
});

No javaScript:
	$(document).ready(function(){
	$("span").click(function(){
	// $("p").html("<h1>Escritora indiana Shri</h1>")
	   // $("div").text ($("p").html());
	   $("p").html($("textarea").val());
	   });
	});

• replaceWith();

Aqui há uma troca de um determinado elemento, por outro especificado nessa função.

No javaScript:
    $(document).ready(function(){
$("span").click(function(){
    $("div").replaceWith("<p>Aqui há uma troca de um determinado elemento, por outro especificado nessa função.</p>");
   });
});