Como selecionar o pai de um nó de texto?

[freela5 0]

Caros, tenho o seguinte problema, salvei o texto de um elemento span numa variavel, e quero selecionar o elemento span novamente pra aplicar um estilo:

 

Só que não consigo selecionar o elemento pai de um nó de texto, tentei usar o .parent() mas não rolou...

 

 

var texto = $('span').text();
texto.parent().css('border','1px solid red'); //aqui nada acontecee...

 

Como faço pra selecionar o pai de um nó de texto?

[Thiago Retondar 18]

Eu fiz aqui com JavaScript sem framework:

 

HTML

<p><span>Text here 1</span></p>
<p><span>Text here 2</span></p>
<p><span>Text here 3</span></p>
<p><span>Text here 4</span></p>
<p><span>Text here 5</span></p>

JavaScript

window.onload = function(){
	var texto = document.getElementsByTagName('span');
	for(var i = 0; i < texto.length; i++){
		texto[i].parentNode.style.border = "1px solid red";
	}
};

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[freela5 0]

Fala Thiago, valeu pela atenção,

 

Então assim da certo pq você capturou a tag span na variavel texto, eu capturei o nó de texto da variavel span...

Se você der um alert na variavel texto vai aparecer "[object]"...

 

Para o script q estou criando preciso capturar o texto e depois aplicar um estilo ao elemento pai... será q tem jeito?

[Thiago Retondar 18]

Na verdade eu não entendi...

 

Se quiser fazer uma verificação, tente algo assim:

 

window.onload = function(){
        var texto = document.getElementsByTagName('span');
		for(var i = 0; i < texto.length; i++){
			if(texto[i].innerHTML == "seu texto") texto[i].parentNode.style.border = "1px solid red";
        }
};

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[Henrique Barcelos 290]

Como assim?

 

Pô, o elemento pai do TextNode é o próprio span...

[freela5 0]

Vou explicar o q quero fazer, estou fazendo um sistema de votação onde capturo o numero de votos de cada elemento span e salvo num Array, depois ordeno por ordem decrescente e aplico um efeito:

 

function sortList() {
  var carro1 = $('#carro1 span').text();
  var carro2 = $('#carro2 span').text();
  var carro3 = $('#carro3 span').text();			
			
  var carros = Array(carro1, carro2, carro3).sort(decrescente); 
			
  carros[0].parent().animate({'top': '0'}, 200);	
  carros[1].parent().animate({'top': '50px'}, 200);
  carros[2].parent().animate({'top': '100px'}, 200);				
}

function decrescente(index1, index2) {
  return index2 - index1;
}

O problema é que no Array tenho nós de texto, pra poder classificar, só que depois na lista não consigo aplicar um efeito no elemento pai (span) pq o .parent() não ta funcionando em nós de texto...

 

Entenderam??

[Henrique Barcelos 290]

Não seria melhor jogar todo o span e jogar no array?

[klonder 14]

Tenho passado pelo tópico todos os dias, mas não respondi por não ter entendido a dúvida.

Entretanto, você disse que está jogando determinados valores em arrays, inclusive valores de texto.

 

Pelo que eu pude abstrair, parece que tudo que você pretende fazer, poderia ser feito utilizando PHP e JavaScript, ou seja, armazenar os valores dos votos e textos em arrays do PHP, vindos obviamente do Banco de Dados, reordená-los e jogar na função Javascript.

 

Exemplo:

opcao[0][0] = 345 votos;

opcao[0][1] = "Gol é o carro mais popular do Brasil";

 

opcao[1][0] = 123 votos;

opcao[1][1] = "Prefiro caminhonete, pois sou fazendeiro";

[freela5 0]

Não seria melhor jogar todo o span e jogar no array?

 

Fala Rick, até da pra jogar todo span no array, mas se eu não usar o .text() não consigo capturar o numero de votos de cada carro... ou consigo?

 

Fala klonder, cara não manjo nada de php, só vai rolar com php??

[Henrique Barcelos 290]

Consegue sim uai.

 

Joga todo o span no array.

 

Quando quiser o total de votos faça:

 

array[indice].text();

[Maujor 144]

$(document).ready(function(){
//function sortList() {
 var carro1 = $('#carro1 span').text(); 
 var carro2 = $('#carro2 span').text();
 var carro3 = $('#carro3 span').text();                        

 var carros = Array(carro1, carro2, carro3).sort(decrescente); 

 $('#carro1 span').text(carros[0])
 $('#carro2 span').text(carros[1])
 $('#carro3 span').text(carros[2])

 $('#carro1').animate({top: '0'}, 200);        
 $('#carro2').animate({top: '50px'}, 200);
 $('#carro3').animate({top: '100px'}, 200); 

function decrescente(index1, index2) {
 return index2 - index1;
}});

Obs: Não esqueça de declarar nas CSS:

#carro1, #carro2, #carro3 {position:relative;}