セルのハイライト表示、データのソート、特定文字列の検索などに対応したデータテーブルを実装するスクリプトを紹介します。
セルのハイライト表示、データのソート、特定文字列の検索などに対応したデータテーブルを実装するスクリプトを紹介します。
はじめに 「新はてなブックマーク」になったということで、とっても便利になったのですが、ブックマーク一覧ページ*1が若干 JavaScript に時間が掛かっているみたいです。 というわけで 調査してみたいと思います。調査して、改善できそうなところは後で纏めて「はてなアイデア」にでも登録しようと思います。 この日記は調査しながら、過程を書いていくつもりです。 準備 まずは、人のサイトの JavaScript を書き換えて試してみるための環境を作ります。 作業用ディレクトリを作る とりあえず、ホームに HatenaJS というディレクトリを作ります。 $ mkdir HatenaJS $ cd HatenaJS CocProxy をダウンロードしてくる 以下から CocProxy というツールをダウンロードしてきます。 http://coderepos.org/share/wiki/CocPr
はじめに 「はてなダイアリー」大好きっこの amachang です。 「はてなダイアリー」には、「バックアップ機能」という機能があってこれがめっちゃ便利です! バックアップ機能とは よく、 mixi とかで「せっかく書いたのに日記消えちゃいました><」的な日記をよく見ますよね。 あれをなくしてくれる機能なのです。 その機能は「日記を書く」ページ(http://d.hatena.ne.jp/edit)の一番下にあります。 しかし Flash 10 では、以下のような状態になってしまい。バックアップ機能が使えません>< これは困りました>< その原因 http://d.hatena.ne.jp/js/local_storage.js で、 Flash のバージョンを以下のように見ている箇所があって、 navigator.plugins["Shockwave Flash"].descriptio
CocProxy めんどくさいことしない置換プロキシー 使い方 http://svn.coderepos.org/share/lang/ruby/cocproxy/proxy.rb をダウンロード `files' というディレクトリをつくる 置換したいファイルをてきとうにつっこむ ruby proxy.rb ポートとか表示されるのでブラウザの設定を変える デフォルトだと、 #{File.basename(req.path_info)}", #{req.host}#{req.path_info}", #{req.host}/#{File.basename(req.path_info)}", .#{req.path_info}", がスキャンされ、ヒットしたら置換されます。 例えば、http://example.com/test/foo/bar.css にアクセスすると files/bar.c
Mac OSX向けのアプリケーションを開発するにはCocoaやObjective-Cといった特有の言語を習得する必要がある。今はWebアプリケーションが盛り上がっているのに、特定のプラットフォームでしか動かない言語を習得するのは面倒くさい、そう考える方も多いはずだ。 アプリケーション一覧、プロセス一覧を表示するデモアプリケーション そんな方に朗報だ。JavaScriptを知っていればMac OSX向けアプリケーションが開発できる時代になってきたのだ。それを可能にするのがJSCocoaだ。 JSCocoaはGoogle Code上で公開されているオープンソース・ソフトウェアで、ライセンスはMITライセンスとなっている。 Mac OSXでは元々RubyCocoaと呼ばれるソフトウェアやPyObjCといったPythonとObjective-Cの橋渡しをするソフトウェアが存在している。この時に使わ
カードローンを利用するときには、この金額までなら何回でも利用するして良いですよ、という上限金額が決まっています。この上限金額のことを限度額と言いますが、、限度額は人によって10万だったり50万だったり100万だったりと差があるものです。今の限度額で十分だという人もいるでしょうし、今の限度額じゃ足りないという人もいるでしょう。そんなとき、限度額の金額を上げたり下げたりすることはできるのでしょうか。 まず限度額はどうやって決まるか、ということですが、限度額は申し込みのときの情報で決まります。勤務先や勤務年数、年収はもちろん、過去や現在の借り入れ状況を全部踏まえた上で限度額が設定されるのです。 そこで決まってしまった限度額ですが、これは必ず変更することができない、というわけではありません。限度額を上げることはもちろん、下げることだってできるんです。変更する方法は、基本的に電話で問い合わせをしてそ
昨日紹介した「わずか「12文字」でIEを判別するスクリプト」に続いて、Firefox 2/3, Safariを判別する1行のスクリプトをThe Spannerから紹介します。
#ff0000">2008年12月29日追記:逆再生する新バージョン「HTML崩壊Reverse! meltdown2.js」をアップ #ff0000">2009年4月21日追記:さらに進化したバージョン「HTMLの暴走(meltdown3)」をアップ まずは軽いページでお試しください。例えば Google とか。*1 javascript:(function(){var s=document.createElement("script");s.charset="UTF-8";var da=new Date();s.src="http://www.rr.iij4u.or.jp/~kazumix/d/javascript/meltdown/meltdown.js?"+da.getTime(); document.body.appendChild(s)})(); これを適当なページのアドレスバ
as, box2dワリオランドシェイクと YouTube のコラボプロモーション が面白かったので、似たようなものを作ってみました。次の文字列をコピーしてアドレスバーに突っ込むと、HTML が崩壊します。javascript:(function(){var d=document; var s=d.createElement("script"); s.charset="UTF-8"; s.src="http://tech.nitoyon.com/meltdown/meltdown.js?"+(new Date()).getTime(); d.body.appendChild(s)})();崩壊するのは画像だけなので、画像があるページで試してみてください。このブログだとこんな具合。画像はドラッグすることも可能です。あまり画像が多いと重くなりすぎるのでご注意を。仕組みFlash と JavaSc
Script.aculo.usは、Thomas Fuchs氏を中心とするチームにより開発されているJavaScriptライブラリだ。MITライセンスが採用されており、2005年から公開を始め、執筆時点では11月に公開されたバージョン1.8が最新版になる。本稿では、そのバージョン1.8を使って(連載継続中にバージョンアップした場合はそちらに変更する可能性がある)、同ライブラリの基本を6回にわたって紹介しよう。 なお、Script.aculo.usを扱ううえでの必須知識となるPrototype.jsの使用法については、連載『いまからはじめるPrototype.js』で解説しているので、そちらをご覧いただきたい。 Script.aculo.usの概要 Script.aculo.usはPrototype.jsをベースに動作するライブラリだが、Prototype.jsが1つのファイルにすべての機能を
はじめに IE8 には Selectors API という新しい仕様が実装されました。 ということで、今後 DOM 操作 API の主流になるであろう Selectors API についてまとめておきます。 Selectors API が使えるブラウザ 2008 年 3 月 6 日現在の一覧 WebKit Build Archives | WebKit (開発版の Safari) Windows | Official Site for Microsoft Windows 10 Home & Pro OS, laptops, PCs, tablets & more (IE8 の Beta 版) Selectors API とは Selectors API とは W3C で定義された仕様です。詳細に関してはこちらをどうぞ 簡単に説明すると getElementsByTagName や getE
id:cho45 がチョロっと書いたコードが話題になっている 冬通りに消え行く制服ガールは✖夢物語にリアルを求めない。 - subtech このような書き方は、自分もたまにする。 というわけで、この書き方をする利点を以下の順に解説して見る。 単純な for 文の問題点 with 文を使った解決方法と、その微妙な問題点 無名関数を使った解決方法 単純な for 文の問題点 まずは、以下の HTML に対して <ul> <li>hoge</li> <li>fuga</li> <li>piyo</li> </ul> 以下の JavaScript を実行して var list = document.querySelectorAll('ul > li'); for (var i = 0, len = list.length; i < len; i++) { var node = list[i]; v
JavaScriptの部分は というわけでid:amachangに任せましょう。 というわけでそれ以外の部分でいったいどこが重いのか 何が重いの?ということで重たい箇所を分析していきましょう。 IBM PageDetailer 解析ツールとしてIBM PageDtailerを利用します。 alphaWorks Community 解説するよりも見てもらうほうが早いと思うのでさっそく使ってみるよ。 ちなみに上記ソフトのダウンロードにはIBMアカウント(無料)が必要なので、使いたい人は登録しよう! http://b.hatena.ne.jp/HolyGrail/ の結果 こんな感じのグラフが出てきます。 では、詳細を見てみましょう。 このグラフですが、長い部分が http://b.hatena.ne.jp/HolyGrail/ のHTMLそのもののロード時間になっています。 内訳としては 濃い
はじめに「はじめての正規表現」がホッテントリ入りしていますが、 導入としては、何に使うのかがわかりやすくて良いのではないかと思います。 あれを見て、基本機能をまとめてみたくなったので、正規表現の基本的な機能について書いてみます。 (正規表現が初めてという人は「はじめての正規表現」を先に見たほうがいいと思います。) 例では「検索」か「置換」をするものとして話を進めていきます。 (「はじめての正規表現」が実例を中心にしたのに対して、こちらは機能を中心に書きます) 正規表現は、プログラミング言語やその他のツールなど、それぞれで微妙な違い(方言)があるので、その点には注意が必要です。 (表記法が違ったり、ここに紹介する機能がサポートされていなかったり、逆に紹介していない機能をサポートしていたりする場合があります) メタ文字とリテラル文字正規表現には、メタ文字とリテラル文字というものがあります。 メ
はじめに 皆様 JavaScript のスピード競争が激化し、 ECMAScript 3.1 の仕様の策定が進むなど、激動の JavaScript 時代をいかがお過ごしでしょうか。 さて今日は、今、ちまたで大ブレイクの兆しを見せている DOM Storage という仕様を紹介したいと思います。 DOM Storage とは何か まず、 DOM Storage とはどんなものなのでしょうか。 とても簡単に言ってしまえば、とてもたくさんのデータが保存できてサーバーに自動で送られない Cookie みたいなものです。 さらに、 Cookie とは違って JavaScript からとても扱い易く作られています。 では、この DOMStorage の具体的なソースコードを見てみましょう。 <!DOCTYPE html> <html> <head><title>DOMStorage の使い方</tit
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く