今時font color=""はなぁと思って書いてみたら妙に長くなってしまった。我ながらなんという資源の無駄。日付を手打ちしてるなら、むしろ日付全体を生成するほうが全然楽だけど、一応この形で足掻いてみた結果。コメント入れまくってるから省けば多少は見やすくなるかもよ。
なお文書内のh1は全て同一フォーマットの日付であることが前提。形式は多少変わってもOKで、右から何文字目が曜日かって部分だけを書き換えれば動くはず。
<html> <head> <title>曜日テスト</title> <style type="text/css"><!-- span.sun{ /* 日曜日 */ color: red; } span.sat{ /* 土曜日 */ color: blue; } --></style> <script type="text/javascript"><!-- // 日付フォーマット中、右から何文字目が曜日か(曜日1文字の場合にしか対応してない) var DAY_POSITION_FROM_RIGHT = 2; /* * <h1>yyyy年mm月dd日(曜)</h1> を * <h1>yyyy年mm月dd日<span class="xxx">(曜)</span></h1> に変換する。 * onloadで実行して塗り替え。 */ function colorDay(){ var targetList = document.getElementsByTagName("h1"); // h1要素のリストを取る for(i=0; i<targetList.length; i++){ // h1の数だけぶん回す // h1の中身を三枚に下ろす(左側、曜日部分、右側) var nodeValue = targetList[i].firstChild.nodeValue; // h1の子であるテキストノードの値(日付)を取る var nodeValueLeft = nodeValue.substring(0,nodeValue.length - DAY_POSITION_FROM_RIGHT); // 左側 var day = nodeValue.charAt(nodeValue.length - DAY_POSITION_FROM_RIGHT); // 曜日 var nodeValueRight = nodeValue.substring(nodeValue.length - DAY_POSITION_FROM_RIGHT + 1, nodeValue.length); // 右側 var dayType = ""; // 曜日に付与するクラス名を算出(平日なら空) if(day == "日"){ dayType = "sun"; } else if(day == "土"){ dayType = "sat"; } var dayObj = document.createElement("span"); // 曜日を入れるspanノードを生成 dayObj.appendChild(document.createTextNode(day)); // 中身文字列は三枚の真ん中(曜日) dayObj.className = dayType; // クラスを付与 // h1の中身作り直し targetList[i].firstChild.nodeValue = nodeValueLeft; // 元々の値を三枚の左側部分のみにする targetList[i].appendChild(dayObj); // その後ろに作った曜日のspanを足す targetList[i].appendChild(document.createTextNode(nodeValueRight)); // その後ろに三枚の右側を足す } } //--></script> </head> <body onload="colorDay();"> <h1>2007年05月25日(金)</h1> <h1>2007年05月26日(土)</h1> <h1>2007年05月27日(日)</h1> <h1>2007年05月28日(月)</h1> </body> </html>
<h1>2007年05月22日(火)</h1>とした時、月~金は黒文字で表示させて、土曜は青文字、日曜は赤文字表記に勝手にするように出来ますか? ジャバスクリプトとかでもムリポ? 日付は...
http://anond.hatelabo.jp/20070522023230 <html><head> <title>Test</title> <script> dowString = new Array('<font color="#ff0000">日</font>','月','火','水','木','金','<font color="...
うおお、わからん、とりあえずHTMLにしてブラウザに突っ込んでみたけどよくわからない。 そのまま突っ込んだだけじゃ駄目なのかな?どういう動作になっているのかまだ把握できない、...
今時font color=""はなぁと思って書いてみたら妙に長くなってしまった。我ながらなんという資源の無駄。日付を手打ちしてるなら、むしろ日付全体を生成するほうが全然楽だけど、一応こ...
http://anond.hatelabo.jp/20070522105212 好みの問題だけど、私ならh1要素のinnerHTMLをreplaceで置き換えちゃうな。 でも、結局静的なことなので、エディタのマクロか何かの機能で書き換えちゃう手を...
結局こうした。 span.saturday { color:blue; } span.sunday { color:red; } なんというローテク。なんというお茶目なCSS。なんという資源の浪費。
俺なら2箇月に一度Perlでまとめて置換するね。