プラス記号を使わずに文字列を結合する。 - 2009-03-18 - hoshikuzu | star_dust の書斎
ご存知のとおりＸ線は医学で多用されています。ただ少々被曝が気になるところではあります。Ｘ線といえども光にすぎないのですが日光に比べて人体にたいする破壊力が大変に大きいのですよね。 さて、量子相関（エンタングルメント）されたＥＰＲ対のように二つの光子をペアで生成し、片方の光子Ａは放置しておいて、もう片方の光子Ｂを人体撮影に使い透過してきたところで先ほど放置しておいた光子Ａとひきあわせます。細かいテクニックはさておいてこの突合せ方法を上手に設定すると、理論値では従来のＸ線の100万分の1の光量で充分に医学的所見が得られるのだそうです。すさまじい。まだまだ必要な機材の開発ができていないようですが。このオハナシは少し前の日経サイエンス誌の記事になっていました。ですからこうしたアーキテクチャの方向性は本当に実現しかねないのです。 こんな未来社会を考えてみませんか？街中いたるところで量子相関Ｘ線撮影機
javascript中でのHTML表現。 - aolog
javascriptで動的なUI等を書くと、どうしてもネックになるのが、HTMLノードの表現、その整理法だ。少なくとも私はそうだ。 pagmo書いていたときなど、コードのかなりの量をHTMLノードの記述に使っている。 しかし本質的には重要なコードではないので、なるべくコンパクトに書きたい。ただ単にテキストで作って、それをinnerHTMLとかで流し込むのは、コードが汚くなるし、ソースの見た目もきたなくなるしいやだ。(短い場合は速度が速いらしいが) common lispやschemeなどでは、S式で表されるリストをつかってデータ構造とし、それをHTMLに変換することをよくするようだ。 たとえば以下のようにする。 (defun standard-page (&key title body) (let ((pbody (cond ((atom body) (list body)) ((atom
選択範囲のリンクを取得する: Days on the Moon
Web ページの選択範囲に含まれるリンクを取得する方法として、Piro さんによる DOM 2 Range の compareBoundaryPoints メソッドを使ったやり方があります。これはリンクを探すのに DOM Core の機能を使って文書ツリーをたどっていますが、今現在ノードを探すといわれて真っ先に思いつくのは XPath でしょう。そこで、XPath を使って選択範囲のリンクを取得する方法を考えてみました。もちろん、選択範囲を扱う以上 DOM 2 Range も利用します。 基本的な考え方 Range オブジェクトの取得 選択範囲の始点より前にあるリンクの数の取得 選択範囲の終点より前にあるリンクの取得 選択されているようには見えないリンクの除外 まとめ 基本的な考え方 基本的なアイデアは、選択範囲の終点より前にあるリンクで、選択範囲の始点より前にはないものが求めるリンクとい
IEの <pre>.innerHTML で複数のスペースを入れる方法 - 葉っぱ日記
IEでは <pre>.innerHTML に連続したスペースや改行を入れると、単一のスペースに置き換わってしまいます。 例えば次のようなJavaScriptをIEとFirefoxで実行してみると: var s = "0123456789ABCDEF\n a b c d"; var pre = document.createElement( "pre" ); pre.innerHTML = s; document.body.appendChild( pre ); IEの表示: Firefoxの表示: IEでは、複数の連続したスペースや改行文字が全て単一のスペースになってしまっています。改行文字を "<br>"に置き換えて、createTextNode() すれば解決しそうな気もしますが、 var s = "<span style=\"color:red\">0123456789ABCDEF<
DocumentFragmentとdisplay:none、documentに直接追加する場合の速度比較 - 素人がプログラミングを勉強していたブログ
追記：コメント欄で指摘されたように、下のコードではイベントリスナは削除されなかった。 DocumentFragmentに一旦ストックすると、登録したイベントリスナは削除される。cloneNode、innerHTMLなども同様。 つまり、下のようなコードを書いて、ドキュメントをクリックしても、"click!"とは表示さない。 document.body.addEventListener("click", function(){ (console.log||alert)("click!"); },false); var df=document.createDocumentFragment(); df.appendChild(document.body); document.documentElement.appendChild(df); 不特定のサイトで動作するGreasemonkeyスクリプ
NodeListやHTMLCollectionに直接アクセスするより、一旦静的な配列にしたほうが速い - 素人がプログラミングを勉強していたブログ
console.time('nodeList'); var elems = document.getElementsByTagName('*'); for(var i=0;i<1000;i++) for(var j=0;j<elems.length;j++) elems[j]; console.timeEnd('nodeList'); console.time('array'); var elems = Array.slice(document.getElementsByTagName('*')); for(var i=0;i<1000;i++) for(var j=0;j<elems.length;j++) elems[j]; console.timeEnd('array'); console.time('length'); var elems = document.getElement
javascript - 特定のDOMをソース表示する : 404 Blog Not Found
2008年07月13日16:00 カテゴリTipsLightweight Languages javascript - 特定のDOMをソース表示する すでにいくつかのentriesで使っているのですが、かなり便利なので改めて紹介。 表示元 表示したいHTMLを適当にdivタグで囲ってidを振っておく。ここではhtml2show 表示先として空のpreを作っておき、そこにもidを振っておく。ここではhtmlsrc 以下のようなscriptを、preタグの直下に転がしとく (function(src, dst){ dst.appendChild(document.createTextNode(src.innerHTML)) })( document.getElementById('html2show'), document.getElementById('htmlsrc') ); もちろん以下
Re: 僕があまりDocumentFragmentを使っていない理由 (agenda)
Latest topics > 僕があまりDocumentFragmentを使っていない理由 - outsider reflex ただ、どんな場合でも上位のDOMノードをゴソッと差し替えて高速化する方法を使うべき、とは言えません。 DocumentFragmentを用いて要素を切り貼りすると、著者スクリプト等が動作しなくなることは私もよく経験しているので、そのスクリプトを検証するまでもなく確かにその通りだと思う。そして文書ツリーを多数回変更するときはDocument Fragmentを経由する (agenda)は、確かにどんな場合でもと言っているように読める。 ここは素直に謝りたい。申し訳なかった。文書ツリーを多数回変更するときはDocument Fragmentを経由する (agenda)を読んで、文書ツリーを多数回変更するときは、どんな場合でもDocument Fragmentを使うべ
Latest topics > 僕があまりDocumentFragmentを使っていない理由 - outsider reflex
Latest topics > 僕があまりDocumentFragmentを使っていない理由 宣伝。日経LinuxにてLinuxの基礎？を紹介する漫画「シス管系女子」を連載させていただいています。 以下の特設サイトにて、単行本まんがでわかるLinux シス管系女子の試し読みが可能！ « スマートロケーションバーでNOT検索できるようにしたXUL/Migemo 0.10.5をリリースしたよ Main 遊びとか本気とか » 僕があまりDocumentFragmentを使っていない理由 - Jul 07, 2008 自分にはちょっと承伏できない理由でJintrick氏にDISられてるので、一応釈明しておきます。 ――「一応」と書いておきながら、Jintrick氏に「バカじゃねーの」みたいに煽られたような気がして感情的になってクドクド書き過ぎてしまったので、最初に例だけ示しておきます。 <?xml
Web 標準的な CSS の値変換方法（px → em など）（訂正あり） - IT戦記
はじめに W3C の仕様に CSS の値を変換が可能なオブジェクトが定義されていることに気がついたのでメモしておきます。 まず CSSStyleDeclaration オブジェクトを取得する 例えば、 var decl = element.style; または、 var decl = getComputedStyle(element, ''); http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSSStyleDeclaration CSSStyleDeclaration オブジェクトから getPropertyCSSValue という関数を使って CSSValue オブジェクトを取得する var val = decl.getPropertyCSSValue('width') http://www.w3.org/TR/DOM-Level
IE8 で実装された Selectors API とは何か？ - IT戦記
はじめに 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
文書ツリーを多数回変更するときはDocument Fragmentを経由する (agenda)
「文書ツリーを多数回変更するときは、直接行なわずにDocument Fragmentを経由してくれ」という話。 一度DOMの実装を書いてみるなり、書こうとしてみるなりすれば分かる。DOM文書ツリーの変更、特にHTML文書におけるそれがどれだけの要素に影響を与えるかが。Document Fragmentの何が良いかといえば、例えば「View」から切り離されていることが挙げられると思う。DOM実装に依存するし想像でしかないけれども、文書ツリーに直接何らかのノードを加えたり削除したりすると、表示スタイルの計算にリソースを多少なり消費するが、Document Fragment中のノード群を操作する限りスタイルは関係ない。操作が完了した後に実際の文書ツリーに一回だけ変更を加えるなら、スタイルの計算も一回ですむ。文字列連結を何度も繰り返すか、それとも文字列の配列を一回だけjoinするかの違いを連想して
HTML要素の位置取得 - elm200 の日記(旧はてなダイアリー)
趣旨 ウェブページとして描画された HTML 要素の画面上の位置を取得する。一見簡単そうに見えるこの作業が、現在実装されているブラウザ上ではとてつもなく難しい。そのことを以下で説明していく。 情報ソース この問題に関して調べたところ、最もよく出来ているエントリは、susie-t 氏による offsetTop/offsetLeft/offsetParentの闇 である。とてつもない力作で、実に多くのケースにわたって、包括的に探究が行われている。まるで犯人を追跡する刑事のような執拗さである。氏の自己紹介では「ナマケモノのプログラマ」とか謙遜されているが、これはとてもナマケモノにできる仕事ではない。 基本中の基本として W3C CSS 2.1 の次の章を抑えておきたい。 8 Box model 9 Visual formatting model 10 Visual formatting mode
セクション内容の参照について (agenda)
div2 が認識可能であるか、XHTML で Pre-HTML 的に <div class="div2"> といった感じでマークアップしていれば、var div2 = document.getElementById('h-7.5').nextSibling; といった感じで id="h-7.5" な属性を持つ h2 要素の次の要素として div2 に相当する要素が取得でき、ここだけユーザに提供する、といった事が簡単に行えます。 Hack Or Die 2007/12 - Ancient libraryより といった感じ、というわけでこれでは殆どのケースでdiv2相当のdiv要素を参照することはできない。これで参照できるのは、h2の終了タグとdivの開始タグが隣接していることが分かっている場合だけだ。普通はソース整形のためのテキストノードになってしまう場合が多いだろう。 // 見出し要素とd
イベントモデルの概念と用語法が混乱しているので、イライライするんですが - 檜山正幸のキマイラ飼育記 (はてなBlog)
[追記 dateTime="2007-12-07 夕刻"]あーっ、今ごろ気付いた。イライライって「イ」がひとつ多いや。タイトルを編集すると、なんか悪いことが起こったりしませんかね？ うーん、いいや。typoしたままにしとこう。ちなみに、「イライライ」は回文になっているぞ。[/追記][追記 date = "2007-12-11"]http://d.hatena.ne.jp/keyword/%a5%a4%a5%e9%a5%a4%a5%e9%a5%a4 [/追記] いつか文句言ってやろうと思っていた件ですよ。長いぞ。 内容： 似てるけど少しずつ違うイベントモデル達 イベントターゲット イベントフロー EventTargetインターフェース イベントハンドラーとイベントリスナー リスナーとハンドラーについてもう少し イベント伝搬とハンドラー実行 イベントの通過または出現 イベントタイプ 「イベント
セレクトボックスのoption要素を並び替えたい！
こんちわ。松田です。 最近作っているシステムで、以下のようなお題が出されました。 問：セレクトボックスで選択した要素を↑↓ボタンで並び替えよ。ただし、CTRL選択による複数選択にも対応すること。（10点） JavaScriptのライブラリは腐るほど出回っているのでとりあえずググろうかと思いましたが、そもそもなんてキーワードで検索したらいいのか分かりません。 「セレクトボックス 並び替え」「selectbox 要素 移動」「selectbox move」・・・ うーん。。。 日本語で検索して引っかからないと、英語ページに救いを求め、だんだんとシンプルな英単語でググっていくことになりますが、今回はなかなかいい結果が見つかりません。 そんなわけでこれは自分で実装してみることにしました。 まずは↓ボタンから作るか。ということで、クリックしたら呼び出される関数をとりあえず定義。 そして、<optio
Latest topics > getElementsByなんちゃら の代わりにXPathを使う - outsider reflex
Latest topics > getElementsByなんちゃら の代わりにXPathを使う 宣伝。日経LinuxにてLinuxの基礎？を紹介する漫画「シス管系女子」を連載させていただいています。 以下の特設サイトにて、単行本まんがでわかるLinux シス管系女子の試し読みが可能！ « 不可逆的な変化に対する感じ方と、死 Main CSS3セレクタとXPathでの表現の対応表 » getElementsByなんちゃら の代わりにXPathを使う - Sep 09, 2007 拡張機能勉強会の時に焚き付けられた、Text Shadowのコード（textshadow.js）を教材にして拡張機能開発のノウハウを解説していくシリーズ。 W3CのDOMでは、要素ノード（およびそのリスト）を得る方法として以下の方法がある。 getElementById(aName) IDをキーにして単一の要素ノー
EfficientJavaScript - Dev.Opera - 効率的な JavaScript
EfficientJavaScript - Dev.Opera - 効率的な JavaScript 目次 この文書について 効率的な JavaScript ECMAScript eval や Function のコンストラクタを使うのはやめよう eval を書き換えよう 関数を使いたいなら function を使おう with を使うのはやめよう 性能を決める関数で try-catch-finally を使うのはやめよう eval と with は隔離しよう グローバル変数を使うのはやめよう 暗黙のオブジェクト変換に気をつけよう 性能を決める関数で for-in を使うのはやめよう 文字列は累積スタイルで使おう プリミティブの操作は関数呼び出しより速い setTimeout() や setInterval() には文字列でなく関数を渡そう DOM 再描画と再フロー 再フローの回数をでき
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://twitter.com/nanto_vi/status/1035852999
Taken SPC : Firefox 3 における <input type="file"> で指定されたファイルへのアクセス