• Revista PROGRAMAR: Já está disponível a edição #53 da revista programar. Faz já o download aqui!

djthyrax

[Resolvido] Como formatar elemento?

27 mensagens neste tópico

Boas.

td > #bodyarea { width:144% !important; }

Este trecho de código formata elementos com o id bodyarea que estejam dentro de td's. No entanto, o que eu quero fazer é formatar os td's que contenham elementos com id bodyarea.

Só posso usar CSS. Any idea?

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Não devo ter percebido bem a tua questão...

de qualquer modo bastaria atribuires essa id ao td

<td id="bodyarea">

Se não for isto explica lá melhor

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Não perceberam.

Eu tenho:

<td>

<div id="bodyarea">

Para "decorar" um elemento com aquele id e que esteja dentro de um td, uso td > #bodyarea. No entanto, eu quero é decorar o <td> que vai ter lá dentro um elemento com aquele id.

Já perceberam? :P

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Não é possivel em CSS2, mas em CSS3 já vai ser possível :P

Agora só mesmo com JS.

Cumprimentos.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

queres formatar inline um <td> em particular? num .css podes formatar um td assim

td{

text-align:left;

font-size:13px;

}

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

O problema do teu código é que vais formatar todos os <td>s, e eu só quero os <td> que têm um child com id bodyarea. ;)

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

qd uso o dreamweaver faço tudo à mão no .css e altero o html dos files .php qd é necessário, mas ainda não sei como se faz isso ;) opah, qd souberes partilha!sff sem dúvida q isso poupa imenso trabalho!! e deixava de ser uma seca formatar certas cenas... ;)

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

considerando que o ficheiro HTML ou XHTML de que falas é também um ficheiro XML.. desde que o código esteja bem formatado.. podes usar um query XPath para descobrir quais os elementos TD que têm "filhos" com o tal ID.. e então, aplicas a esses TDs a tal class CSS.

usando o método "selectNodes".

djthyrax .. provavelmente não é nada disto que queres... mas apeteceu-me meter aqui umas postas de bacalhau!  :)

inté!

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

jsWizard, usando javascript bastava-me fazer, por exemplo, document.getElementById("bodyarea").parent.setAttribute("style", "o css vem para aqui"); (e sim, só há 1 #bodyarea) :)

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

não é "parent" mas sim "parentElement" ou "parentNode".

mas isso só funciona se o tal elemento com o tal id for o primeiro filho do td.. se não terias de fazer backtrack até encontrar o td..

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

não é "parent" mas sim "parentElement" ou "parentNode".

wtv, não sei a especificação do DOM de cor :) Anyway, agora fiquei curioso. Como tiro o tagname de um elemento?
0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

atributo "tagName"

por exemplo:

window.document.getElementById('id_do_elemento').tagName

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Bacano. :)

var actual = document.getElementById("bodyarea");
while(actual.tagName.lower() != 'td') actual = actual.parentElement;
actual.setAttribute("style", "css here");

Certo?

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

"lower()" não conheço.. "toLowerCase()" já conheço.

convém que controles no ciclo while se ainda existe parentElement.. só para o caso de andares à procura de um TD que não existe.. porque nesse caso varrerias o HTML todo até rebentar!

de resto.. parece-me bem.

já agora, usar { } no while mesmo que só tenha uma instrução é sempre boa politica.. torna o código mais legivel.

inté!

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

"lower()" não conheço.. "toLowerCase()" já conheço.

convém que controles no ciclo while se ainda existe parentElement.. só para o caso de andares à procura de um TD que não existe.. porque nesse caso varrerias o HTML todo até rebentar!

de resto.. parece-me bem.

já agora, usar { } no while mesmo que só tenha uma instrução é sempre boa politica.. torna o código mais legivel.

inté!

Essa do lower() é culpa do Python... Anyway, tu sugeres portanto:

var actual = document.getElementById("bodyarea");
while(typeof actual != 'undefined' && actual.tagName.toLowerCase() != 'td')
    actual = actual.parentElement;
if(typeof actual != 'undefined')
    actual.setAttribute("style", "css here");

Certo? (não ligues às {})

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

parece-me quase bem... ou seja, acho que devia ser assim:

em vez de actual.setAttribute("style", .....);

deveria ser:

actual.style.color = '#FF0000';  // por exemplo

ou ainda melhor

actual.className = 'class_css';

isto porque.. parece-me que se colocares actual.setAttribute("style", "color:#FF0000;text-align:center;  etc etc.. ");  não vai funcionar.. pelo menos em alguns browsers.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Ois

Concordo com o que o jsWizard disse.

Crias duas classes (para o exemplo class1 e class2), class1 para os TDs normais e

a class2 para os TDs com o child "bodyarea".

Nao podes usar o getElementById pq este so  vai retornar 1 elemento e tu podes ter varios,

entao tens de usar getElementsByName.

Neste exemplo o TD eh o parent de "bodyarea", se nao eh o caso vais ter de usar um FOR ate chegar ao TD.

function AddMyEvent(El, Ev, Func)
{
if(window.addEventListener)
{
	El.addEventListener(Ev,Func,false);
}
else
{
	El.attachEvent("on"+Ev,Func);
}
}

AddMyEvent(window, "load", ChangeClass);

function ChangeClass()
{
   var Elements = document.getElementsByName("bodyarea");
   for (var aa=0;aa<Elements.length;aa++)
   {
      Elements.item(aa).parentNode.className = "Class2";
   }
}

Espero ter ajudado.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

getElementsByName para quê se eu só vou ter 1 bodyarea? A tag id serve para identificar um elemento único, é isso que diz o standard. :(

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

O problema do teu código é que vais formatar todos os <td>s, e eu só quero os <td> que têm um child com id bodyarea. :P

Como aqui dizes "os <td>" pensei que fossem varios.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

O problema do teu código é que vais formatar todos os <td>s, e eu só quero os <td> que têm um child com id bodyarea. :P

Como aqui dizes "os <td>" pensei que fossem varios.

document.getElementsByTagName('td').getElementById('bodyarea')

Era isso que eu queria dizer. :D

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!


Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.


Entrar Agora