JavaScript og CSS specificitet?

[J�rn Andersen]

Hej,

Hvordan t�ller CSS styles sat med javascript i forhold til andre style
settings, hvis man fx bruger getElementById?

Jeg er st�dt p� et lidt "sjovt" problem: Jeg har en submit-knap, som
jeg fint kan s�tte "disabled" p� (s� jeg "har fat" i den).

Men jeg kan af en eller anden grund ikke s�tte fx color og
background-color p� den i Firefox (17.0.1, Win).
Safari (5.1.7) opf�rer sig helt som forventet.
IE9 n�sten ogs�.
Opera (12.12) fatter ikke ret meget (hvilket m�ske betyder, at *jeg*
har misforst�et et eller andet ...).

Er det browserne, der er uenige om CSS-specificitet?
Hvor kan jeg l�se noget hurtigt-fatteligt om det?


Jeg er ikke s�rligt stiv i javascript, s� I f�r lige lidt kode:

var btnRedirect = document.getElementById("red_redirect");
btnRedirect.disabled = "disabled";
btnRedirect.style["background-color"] = "magenta";
btnRedirect.style["color"] = "aqua";
- det hele bliver kaldt af en window.onload-function

Mvh. og p� forh�nd tak,
J�rn

--
J�rn Andersen
http://socialister.dk
http://marxisme.dk

[scootergrisen]

> btnRedirect.style["background-color"] = "magenta";
> btnRedirect.style["color"] = "aqua";

Brug .style.backgroundColor og .style.color i stedet for.

[J�rn Andersen]

On Thu, 27 Dec 2012 17:55:15 +0100, scootergrisen <NEJ...@TILSPAM.DK>
wrote:

>> btnRedirect.style["background-color"] = "magenta";
>> btnRedirect.style["color"] = "aqua";
>
>Brug .style.backgroundColor og .style.color i stedet for.

Tak, det var lige det, der skulle til. Jeg har nok kigget for meget i
gamle scripts ;-)

Det ser ud til at virke p� tvlrs af browsere.

Tak for hj�lpen.

Mvh. J�rn

[Stig Johansen]

J�rn Andersen wrote:

> Tak, det var lige det, der skulle til. Jeg har nok kigget for meget i
> gamle scripts ;-)

Lad v�re med det;-)

> Det ser ud til at virke p� tvlrs af browsere.

Du kan med fordel bruge DOM inspector med FF, s� kan du se hvad de
forskellige properties/functions hedder.

Et n�rmest uvurderligt v�rkt�j.

Findes vist ogs� til IE, men jeg husker ikke l�ngere hvor jeg har den fra
(IE6).

--
Med venlig hilsen
Stig Johansen

[Rune Jensen]

On 27 Dec., 20:29, Jørn Andersen <j...@jorna.dk> wrote:
> On Thu, 27 Dec 2012 17:55:15 +0100, scootergrisen <NEJ...@TILSPAM.DK>
> wrote:
>
> >> btnRedirect.style["background-color"] = "magenta";
> >> btnRedirect.style["color"] = "aqua";
>
> >Brug .style.backgroundColor og .style.color i stedet for.
>
> Tak, det var lige det, der skulle til. Jeg har nok kigget for meget i
> gamle scripts ;-)
>

> Det ser ud til at virke på tvlrs af browsere.

Spørgsmålet er, om du ikke får bedre performance, hvis du lægger
ændringerne ind som classes, og så med javascript tildele den class
til de tags, som skal have ændringerne.

Jeg kan ikke huske baggrunden helt, men jeg kan mindes noget om, at
det med at ændre og tildele styles egenskaber direkte via JS, er ret
langsomt.


MVH
Rune Jensen

[Birger Sørensen]

Rune Jensen kom med fï¿œlgende:

> On 27 Dec., 20:29, Jï¿œrn Andersen <j...@jorna.dk> wrote:
>> On Thu, 27 Dec 2012 17:55:15 +0100, scootergrisen <NEJ...@TILSPAM.DK>
>> wrote:
>>
>>>> btnRedirect.style["background-color"] = "magenta";
>>>> btnRedirect.style["color"] = "aqua";
>>> Brug .style.backgroundColor og .style.color i stedet for.
>>
>> Tak, det var lige det, der skulle til. Jeg har nok kigget for meget i
>> gamle scripts ;-)
>>

>> Det ser ud til at virke pￜ tvlrs af browsere.
>
> Spï¿œrgsmï¿œlet er, om du ikke fï¿œr bedre performance, hvis du lï¿œgger
> ￜndringerne ind som classes, og sￜ med javascript tildele den class
> til de tags, som skal have ï¿œndringerne.

>
> Jeg kan ikke huske baggrunden helt, men jeg kan mindes noget om, at

> det med at ï¿œndre og tildele styles egenskaber direkte via JS, er ret
> langsomt.
>
>
> MVH
> Rune Jensen

... Fordi en ￜndring i style medfￜrer en omgￜende redraw. Sￜ for hver
gang noget ï¿œndres gentegnes skï¿œrmen.
Noget med at man kan tage de aktuelle elementer ud af DOM og sï¿œtte dem
tilbage efter manipulering, for optimering af den slags.
Kan ikke lige huske hvordan..

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
Utils http://sdccms.dk/ordbog/ http://sdccms.dk/mailfriend/
http://bredelund.dk CMS som det var meningen et sï¿œdant skulle vï¿œre

[Birger Sørensen]

Rune Jensen skrev den 12/28/2012:

> On 27 Dec., 20:29, Jï¿œrn Andersen <j...@jorna.dk> wrote:
>> On Thu, 27 Dec 2012 17:55:15 +0100, scootergrisen <NEJ...@TILSPAM.DK>
>> wrote:
>>
>>>> btnRedirect.style["background-color"] = "magenta";
>>>> btnRedirect.style["color"] = "aqua";
>>> Brug .style.backgroundColor og .style.color i stedet for.
>>
>> Tak, det var lige det, der skulle til. Jeg har nok kigget for meget i
>> gamle scripts ;-)
>>

>> Det ser ud til at virke pￜ tvlrs af browsere.
>
> Spï¿œrgsmï¿œlet er, om du ikke fï¿œr bedre performance, hvis du lï¿œgger

> ￜndringerne ind som classes, og sￜ med javascript tildele den class
> til de tags, som skal have ï¿œndringerne.

>
> Jeg kan ikke huske baggrunden helt, men jeg kan mindes noget om, at

> det med at ï¿œndre og tildele styles egenskaber direkte via JS, er ret
> langsomt.
>
>
> MVH
> Rune Jensen

... i DOM hedder det DocumentFragment, og er en container af samme
slags som document - men den bliver ikke vvist pￜ skￜrmen, og er ikke
en del af document selv.
Brug google - DocumentFragment - der er mange steder at blive klog.
Om det kan betale sig, afhï¿œnger nok af hvor mange ï¿œndringer du skal
lave. Ud over at det selvfï¿œlgelig aldrig er spild, at lï¿œre noget nyt,
selvfï¿œlgelig.
;-)

[Rune Jensen]

On Dec 28, 7:14 pm, Birger Sørensen <s...@bbsorensen.com> wrote:

> ... Fordi en ændring i style medfører en omgående redraw. Så for hver
> gang noget ændres gentegnes skærmen.

Ja, der var det.

Jeg husker det, fordi jeg har set en Tech Talk video om JavaScrip
hastighed, hvor ham manden som holdt foredraget var en yderst
fascinerende taler. Mest fordi han talte, så jeg forstod det :)

Ikke sikkert at det påvirker Jørns projekt med hastigheden særligt
meget, men rent kodemæssigt, så er det vel bedst at lære det rigtige
fra start.

Jeg mener så ikke nødvendigvis, man behøver bruge DocumentFragment i
dette tilfælde. Men jeg skal prøve at finde den video, hvor det bliver
omtalt.



MVH
Rune Jensen

[Rune Jensen]

On Dec 29, 1:05 am, Birger Sørensen <s...@bbsorensen.com> wrote:

> Brug google - DocumentFragment - der er mange steder at blive klog.

> Om det kan betale sig, afhænger nok af hvor mange ændringer du skal
> lave. Ud over at det selvfølgelig aldrig er spild, at lære noget nyt,
> selvfølgelig.
> ;-)

Den metode, jeg talte om er omtalt her, og jeg har lagt linket til den
rigitge tid, så videoen starter, hvor han taler om det:
https://www.youtube.com/watch?feature=player_detailpage&v=mHtdZgou0qU#t=2101s

Lige før det, så taler han om DocumentFragment, som du omtalte.

Men lyt til hele foredraget helt fra start - han er skide god, og han
er overhovedet ikke kedelig!


MVH
Rune Jensen

[Birger Sørensen]

Rune Jensen forklarede den 12/29/2012:

> On Dec 29, 1:05ï¿œam, Birger Sï¿œrensen <s...@bbsorensen.com> wrote:
>
>> Brug google - DocumentFragment - der er mange steder at blive klog.

>> Om det kan betale sig, afhï¿œnger nok af hvor mange ï¿œndringer du skal
>> lave. Ud over at det selvfï¿œlgelig aldrig er spild, at lï¿œre noget nyt,
>> selvfï¿œlgelig.

>> ;-)
>
> Den metode, jeg talte om er omtalt her, og jeg har lagt linket til den

> rigitge tid, sￜ videoen starter, hvor han taler om det:
> https://www.youtube.com/watch?feature=player_detailpage&v=mHtdZgou0qU#t=2101s
>
> Lige fￜr det, sￜ taler han om DocumentFragment, som du omtalte.

>
> Men lyt til hele foredraget helt fra start - han er skide god, og han
> er overhovedet ikke kedelig!
>
>
> MVH
> Rune Jensen

Prï¿œcis. Det var det link, jeg ikke kunne finde... :-Z