SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Guru dale_burrell's Avatar
    Join Date
    Aug 2002
    Location
    Wellington, New Zealand
    Posts
    861
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Access style elements from the DOM

    OK, how do I change style elements from the DOM?

    e.g. text-decoration?

    this.style.??? = ???.

    Also in general how are these elements accessed. I can get to most of the simple ones because they are obvious, but all the extended ones aren't obvious.
    If you aren't living life on the edge
    - you're taking up too much space
    Creative Dreaming Ltd / Ask The Local / Amanzi Travel

  2. #2
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)

    Re: Access style elements from the DOM

    Originally posted by dale_burrell
    OK, how do I change style elements from the DOM?

    e.g. text-decoration?

    this.style.??? = ???.

    Also in general how are these elements accessed. I can get to most of the simple ones because they are obvious, but all the extended ones aren't obvious.
    If the style attribute is dashed in CSS, then it is camelCased in Javascript. Here are some examples:

    CSS               Javascript
    text-decoration  textDecoration
    background-color    backgroundColor
    font-family         fontFamily

    And so on and so forth.

    Have fun!

    --Vinnie

  3. #3
    Sultan of Ping jofa's Avatar
    Join Date
    Mar 2002
    Location
    SvÝ■jˇ­
    Posts
    4,080
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    To be more exact; lowerCamelCase
    E.g. the CSS can be written
    text-decoration:underline;
    Text-Decoration:underline;
    TEXT-DECORATION:underline;
    but in javascript you must write
    obj.style.textDecoration = 'underline';


    CSS reference

  4. #4
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Originally posted by jofa
    To be more exact; lowerCamelCase
    E.g. the CSS can be written
    text-decoration:underline;
    Text-Decoration:underline;
    TEXT-DECORATION:underline;
    but in javascript you must write
    obj.style.textDecoration = 'underline';


    CSS reference
    Still better than PascalCase; and all are better than iNconSisTentCasE!

    --Vinnie

  5. #5
    Sultan of Ping jofa's Avatar
    Join Date
    Mar 2002
    Location
    SvÝ■jˇ­
    Posts
    4,080
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You mean TPascalCase?

  6. #6
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Originally posted by jofa
    You mean TPascalCase?
    (remembers programming methodology classes in school)AAAAAAAAAAAHHHHHHHHHHHHH!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •