jquery＋csvで簡易電力メーター
Firefox 5 で、meter 要素が表示されない？！
<!DOCTYPE html> <title></title> <style type="text/css"> meter { width:300px; } </style> <h1>東京電力</h1> <div id="hoge"> </div> <script> function view (data) { var no = 0; var obj; var rec; var html = ''; var day; data.reverse (); while (obj = data[no++]) { day = new Date (obj.created_at); rec = obj.text.replace (/,/g, '').match (/([-+]?[0-9.]+)/g); if (rec) { dt = day.getDate () + ' ' + day.getHours () + ':00'; html += '<li>' + dt + '<meter high="90" max="100" value="' + rec[2] + '"> 電力使用率:'+rec[2]+' % </meter> '+rec[1]+'万kW / '+rec[4]+'万kW</li>'; } } document.getElementById ('hoge').innerHTML = '<ol>'+ html + '</ol>'; } </script> <script src="http://api.twitter.com/1/statuses/user_timeline.json?screen_name=setsudensan&count=24&callback=view"></script>
俺が住んでいる地域の電力会社は、東北電力だった。そしてつぶやいているのを見つけた。
<!DOCTYPE html>
<title></title>
<style type="text/css">
meter {
width:300px;
border-width:50px;
}
</style>
<h1>東北電力</h1>
<div id="hoge"> </div>
<script>
function view (data) {
var no = 0;
var obj;
var rec;
var html = '';
var day;
data.reverse ();
while (obj = data[no++]) {
day = new Date (obj.created_at);
rec = obj.text.replace (/,/g, '').match (/([-+]?[0-9.]+)/g);
if (rec.length == 12) alert(rec);
if (rec.length == 12) continue;
dt = rec[0] + ':' + rec[1] + '-' + rec[2] + ':' + rec[3];
html += '<li>' + dt + '<meter high="90" max="100" value="' + rec[6] +
'"> 電力使用率:'+rec[6]+' % </meter> '+rec[4]+'万kW / '+rec[5]+'万kW</li>';
}
document.getElementById ('hoge').innerHTML = '<ol>'+ html + '</ol>';
}
</script>
<script src="http://api.twitter.com/1/statuses/user_timeline.json?screen_name=tohokuepcopower&count=48&callback=view"></script>
FORM 要素の elements のあれこれにむけて（評価用のHTMLサンプル）
<!DOCTYPE html> <title>FormElements</title> <style> table { border :2px #008 ridge; border-spacing: 0px; } thead th, tfoot th { background : #bbd; border : 2px #008 ridge; } tbody th { background : #eef; border : 2px #008 ridge; font-weight : normal; } tbody td { background : #f8fff8; border : 2px #080 ridge; padding : 1px 3px; } tbody td:nth-of-type(2) { background : #eee; border : 2px #888 ridge; padding : 1px 3px; font-size:small; width : 27em; } </style> <form action="#" id="hoge" enctype="multipart/form-data"> <table> <thead> <tr> <th>name(node) <th>type(node) <th>example <th>memo <th>max <th>min <th>pattern <th>required <th>step </thead> <tbody> <tr> <th rowspan="23">INPUT <th>radio <td> <input type="radio" name="rd0" value="a" checked="checked" id="rd00"> <label for="rd00">A</label> <input type="radio" name="rd0" value="b" id="rd01"> <label for="rd01">B</label> <input type="radio" name="rd0" value="c" id="rd02"> <label for="rd02">C</label> <td>列挙値・ラジオ・ボタン <td>− <td>− <td>− <td>○ <td>− <tr> <th>checkbox <td> <input type="checkbox" name="chk0" value="a" checked="checked" id="chk00"> <label for="chk00">A</label> <input type="checkbox" name="chk0" value="b" id="chk01"> <label for="chk01">B</label> <input type="checkbox" name="chk0" value="c" id="chk02"> <label for="chk02">C</label> <td>定義リストから複数選択・チェック・ボックス <td>− <td>− <td>− <td>○ <td>− <tr> <th>text <td><input type="text" name="a0" value="ABCDEFG" size="40"> <td>テキスト・フィールド <td>− <td>− <td>○ <td>○ <td>− <tr> <th>search <td><input type="search" name="search0" value="matchSelecter" size="40"> <td>検索フィールド <td>− <td>− <td>○ <td>○ <td> <tr> <th>Tel <td><input type="tel" name="tel0" value="090-0000-000" size="40"> <td>電話 <td>− <td>− <td>○ <td>○ <td>− <tr> <th>Url <td><input type="url" name="url0" value="http://d.hatena.ne.jp/babu_babu_baboo/" size="40"> <td>絶対 IRI <td>− <td>− <td>○ <td>○ <td>− <tr> <th>Email <td><input type="email" name="email0" value="babu_babu_baboo@docomo.co.jp" size="40"> <td>電子メール <td>− <td>− <td>○ <td>○ <td>− <tr> <th>Datetime <td><input type="datetime" name="datetime0" value="2011-06-30T12:34:56Z"> <td>日付けと時間（タイム・ゾーンが UTC） <td>○ <td>○ <td>− <td>○ <td>○ <tr> <th>Date <td><input type="date" name="date0" value="2011-06-30"> <td>タイムゾーン無しの日付（年,月,日） <td>○ <td>○ <td>− <td>○ <td>○ <tr> <th>Month <td><input type="month" name="month0" value="2011-06"> <td>タイムゾーン無しの年月 <td>○ <td>○ <td>− <td>○ <td>○ <tr> <th>Week <td><input type="week" name="week0" value="2011-W12"> <td>タイムゾーン無しで,week-year number と week number から構成されるデータ <td>○ <td>○ <td>− <td>○ <td>○ <tr> <th>Time <td><input type="time" name="time0" value="12:34:56"> <td>タイムゾーン無しの時間（時,分,秒,小数点以下の秒） <td>○ <td>○ <td>− <td>○ <td>○ <tr> <th>Datetime-local <td><input type="datetime-local" name="datetime-local0" value="2011-06-30T21:04:56"> <td>タイムゾーン無しの日時（年,月,日,時,分,秒,小数点以下の秒） <td>○ <td>○ <td>− <td>○ <td>○ <tr> <th>number <td><input type="number" name="range0" min="0" max="100" value="10"> <td>数値 <td>○ <td>○ <td>− <td>○ <td>○ <tr> <th>Range <td><input type="range" name="range0" min="0" max="100" value="10"> <td>スライダー・コントロール <td>○ <td>○ <td>− <td>− <td>○ <tr> <th>Color <td><input type="color" name="color0" value="#000000"> <td>8 ビットの赤,緑,青のコンポーネントを持つ sRGB <td>− <td>− <td>− <td>− <td>− <tr> <th>hidden <td><input type="hidden" name="h0" value="h1"> <td>任意の文字列 <td>− <td>− <td>− <td>− <td>− <tr> <th>password <td><input type="password" name="ps" size="10" maxlength="30" size="40"> <td>パスワード <td>− <td>− <td>○ <td>○ <td>− <tr> <th>file <td><input type="file" name="fn" size="25"> <td>0 個以上のファイル <td>− <td>− <td>− <td>○ <td>− <tr> <th>image <td><input type="image" src="./img/0.gif" alt="xxx" name="img"> <td>クリッカブルなイメージ,または,ボタン <td>− <td>− <td>− <td>− <td>− <tr> <th>button <td><input type="button" value="button" name="bt"> <td>ボタン <td>− <td>− <td>− <td>− <td>− <tr> <th>reset <td><input type="reset"> <td>リセット <td>− <td>− <td>− <td>− <td>− <tr> <th>submit <td><input type="submit"> <td>送信 <td>− <td>− <td>− <td>− <td>− </tbody> <tbody> <tr> <th colspan="2">SELECT <td> <select name="car"> <option value="sel0">TOYOTA</option> <option value="sel1">HONDA</option> <option value="sel2">NISSAN</option> </select> <td>選択肢のセットの中から選択させる <td colspan="5" rowspan="2"> <tr> <th colspan="2">SELECT(multiple) <td> <select name="car_all" multiple> <optgroup label="normal"> <option value="sel0">TOYOTA</option> <option value="sel1">HONDA</option> <option value="sel2">NISSAN</option> <option value="sel3">MATHDA</option> <option value="sel4">SUBAL</option> <option value="sel5">SUZUKI</option> </optgroup> <optgroup label="compact"> <option value="sel1">DAIHATU</option> <option value="sel2">NISSAN</option> <option value="sel3">SUBAL</option> <option value="sel4">ISUZU</option> <option value="sel5">SUZUKI</option> </optgroup> </select> <td>選択肢のセットの中から選択させる（複数） </tbody> <tbody> <tr> <th colspan="2">TEXTAREA <td> <textarea name="ta0" col="60" row="5">ta0Value</textarea> <td>マルチラインのプレーンテキスト <td colspan="5" rowspan="3"> <tr> <th colspan="2">BUTTON <td><button type="button">ボタンの内容</button> <td>ボタン <tr> <th colspan="2">FIELDSET <td> <fieldset> <legend>Dummy<legend> </fieldset> <td>form.elements に含まれる </tbody> </table> </form>
HTMLで誕生石と星座をアラート表示するスクリプト
http://oshiete.goo.ne.jp/qa/6829861.html
Fujillin さんが食いつくと思っていたので静観してみたものの、回答したらやっぱり食いついていたのが判明した。
しかも説明がなされているので、ポイントは貴方に！おめでとうございます（と予言）。
そういえば、「幸福への近道」http://kinmiraiken.jp/ 東北大震災を予言したとされている人のページに、あることないこと書かれている。
いずれ関東方面にも（？）とあるので、注意されたし。
防災グッズをアマゾンから購入しようと思ったら、売り切れ続出で落ち込む。
太陽電池と、バッテリー、バッテリー過充電防止装置と、正弦波のインバーター。
もちろん、価格も高いので、あきらめている。
var A = ['やぎ', 'みずがめ', 'うお', 'おひつじ', 'おうし', 'ふたご', 'かに', 'しし', 'おとめ', 'てんびん', 'さそり', 'いて']; var B = ['ガーネット', 'アメシスト', 'アクアマリン', 'ダイヤモンド', 'エメラルド', 'パール', 'ルビー', 'ペリドット', 'ブルーサファイア', 'オパール', 'トパーズ', 'トルコ']; function constellation (yyyymmdd) { var ymd = parseInt (yyyymmdd, 10); //文字列だと思うので十進数の数値に変換 var md = ymd % 10000; var m = Math.floor (md / 100); var x = m * 100 + 21 + (4 < m) + (6 < m) * 2 - ( 9 < m); return md < x ? m - 1: m == 12 ? 0: m; } function birthstone (yyyymmdd) { var ymd = parseInt (yyyymmdd, 10); //文字列だと思うので十進数の数値に変換 var m = Math.floor (ymd % 10000 / 100) - 1; // 月の部分だけを計算する return m; } alert (A[constellation ('20000101')]); alert (B[birthstone ('20001231')]);
N88-BASIC の実装？
妄想しながら思った。
「コンパイラを！」吐き出すコードは、もちろんJavaScript。
だめだ！×２、自らハードルを上げるようなことをしてはならない。
自分に言い聞かせて、眠ろう。明日も早い。
