直書きされたstyleを無効化する方法
このページをレスポンシブ対応して欲しいんだけど、、、
とか言われてソースを見てみたら、下記のようにhtmlソース内にstyleを直書きされていた、、、
という経験ありませんか?
もしくは、更新作業を別の人に任せてたら、いつのまにかstyle直書きがデフォルトになってたとか。
<body> <div style="width:500px; background:#FFC200; height:300px;"> style直接書いちゃった <div style="width:300px; margin:auto; background:#fff; height:150px; margin-top:50px;"> HOGE- </div> </div> </body>
こういう書き方する人はソースを触らないで!と思うのですが、実際にはそうもいかず。
さらにレスポンシブ対応させるにはCSSを構築しながらHTML側のソースも整理していかないといけない。
でもそんな面倒くさいことできない、、、、という方に是非。
直書きされたスタイルを無効化するjQueryのコードです。
どうぞ。
<script type="text/javascript"> <!-- $(function() { $('body *').removeAttr('style'); }); --> </script>
やってることはシンプルですね。
body内のすべての要素の「style」属性を消すという処理です。
さらに「width」や「height」も無効化してやりたいという場合は、下記も追加してください。
$('body *').removeAttr('width'); $('body *').removeAttr('height');