SitePoint Sponsor

User Tag List

Results 1 to 16 of 16

Hybrid View

  1. #1
    SitePoint Guru
    Join Date
    Nov 2008
    Posts
    622
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Remove inline styles from <table><tr><td>

    hi

    i want to remove the inline styles from <table><tr><td> inside the <div id="tt">

    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Untitled Document</title>
    <script type="text/javascript">
    document.removeAttribute('style');
    </script>
    </head>
    <body>
    <div id="tt">
    <table>
          <tr style="PADDING-BOTTOM: 0px; BORDER-RIGHT-WIDTH: 0px; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; BORDER-TOP-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; FONT-SIZE: 11px; VERTICAL-ALIGN: baseline; BORDER-LEFT-WIDTH: 0px; PADDING-TOP: 0px; border-image: initial">
                <td style="BACKGROUND-IMAGE: none; BORDER-BOTTOM: rgb(240,240,240) 1px solid; PADDING-BOTTOM: 1px; BORDER-RIGHT-WIDTH: 0px; BACKGROUND-COLOR: rgb(250,250,250); MARGIN: 0px; PADDING-LEFT: 6px; WIDTH: 77px; BACKGROUND-ATTACHMENT: scroll; PADDING-RIGHT: 6px; FONT: bold 12px/16px Arial; BACKGROUND-POSITION: 0px 0px; BORDER-TOP-WIDTH: 0px; COLOR: rgb(125,116,100); VERTICAL-ALIGN: top; BORDER-LEFT-WIDTH: 0px; PADDING-TOP: 1px; background-origin: initial; background-clip: initial; border-image: initial" class="ttl"><font color="#7d7464">2G Network</font></td>    
            </tr>
    </table>
    </div>
    </body>
    </html>
    vineet

  2. #2
    SitePoint Guru
    Join Date
    Nov 2008
    Posts
    622
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    i tried this also
    Code:
    <script language="javascript">
    $("body").attr("style", "");
    </script>
    but doesnt works

    vineet

  3. #3
    SitePoint Guru
    Join Date
    Nov 2008
    Posts
    622
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    this also doesnt works

    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Untitled Document</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    $('#foo').removeAttr('style');
    </script>
    </head>
    <body>
    <div id="foo" style="font-family:Arial, Helvetica, sans-serif"></div>
    </body>
    </html>
    vineet

  4. #4
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,710
    Mentioned
    102 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by vinpkl View Post
    this also doesnt works

    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Untitled Document</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    $('#foo').removeAttr('style');
    </script>
    </head>
    <body>
    <div id="foo" style="font-family:Arial, Helvetica, sans-serif"></div>
    </body>
    </html>
    The reason why that doesn't work is that you are attempting to access and remove something that doesn't even exist yet.
    When the script runs, this is what the page looks like:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Untitled Document</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    $('#foo').removeAttr('style');
    </script>
    Notice that nothing below the script exists yet. That part of the DOM (document object model) has not even been loaded yet.

    Place the jQuery code within a jQuery callback, and that will delay execution of the script until the DOM has loaded and is ready to be worked with.

    Code javascript:
    $(function () {
        $('#foo').removeAttr('style');
    });
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  5. #5
    SitePoint Guru
    Join Date
    Nov 2008
    Posts
    622
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    hi paul

    i tried your solution. but that also doesnt works. Am i again missing something ?

    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Untitled Document</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(function () {
        $('#foo').removeAttr('style');
    });
    </script>
    </head>
    
    <body>
    <div id="foo" style="font-family:Arial, Helvetica, sans-serif"></div>
    </body>
    </html>
    vineet

  6. #6
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,710
    Mentioned
    102 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by vinpkl View Post
    i tried your solution. but that also doesnt works. Am i again missing something ?
    It works for me. Are you still seeing it for example when you view the source?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  7. #7
    SitePoint Guru
    Join Date
    Nov 2008
    Posts
    622
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    sorry my mistake

    thanks a lot for your help

    everything is working fine now.

    vineet

  8. #8
    SitePoint Guru
    Join Date
    Nov 2008
    Posts
    622
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    one more question i have.

    In my php cms, If i want to remove all the "styles" from the content which gets added automatically while pasting content in the form.

    then what is the solution.

    vineet

  9. #9
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,710
    Mentioned
    102 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by vinpkl View Post
    In my php cms, If i want to remove all the "styles" from the content which gets added automatically while pasting content in the form.
    Our PHP forum might have a solution for you with that.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  10. #10
    SitePoint Guru
    Join Date
    Nov 2008
    Posts
    622
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    hi paul

    yes i forgot you already said that

    Code:
    It is not possible for JavaScript to edit the contents of the HTML file.
    vineet


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
  •