[B! javascript][dom] teppeisのブックマーク

JavaScript APIs you’ve never heard of (and some you have)

JavaScript APIs you’ve never heard of (and some you have)1 of 67

teppeis 2012/11/18

nextElementSibling, insertAdjacentHTML, createHTMLDocument

リンク

Sorry; your browser does not support svg! Sorry; your browser does not support svg! http://www.meetup.com/framsia/ < 100ms "0.1 second [100ms] is about the limit for having the user feel that the system is reacting instantaneously, meaning that no special feedback is necessary except to display the result." Jakob Nielsen

teppeis 2012/04/11

Reflowを起こすプロパティとか、そのへんのまとめ

リンク

DOMベースXSSの検出ツール

(Last Updated On: 2011年11月3日)久しぶりにブログを更新すると色々書きたくなるものですね。ということでまだこのブログでは紹介したことがないDOMベースXSSのオープンソースツール、DOMinatorを紹介します。最近の商用ツールも類似の機能をサポートしています。 http://code.google.com/p/dominator/ DOMベースXSS‥ JavascriptはDOMを利用してHTMLを動的に変更できます。この機能を利用するとブラウザ側のJavascriptで動的に変化するWebサイトを構築できます。HTMLなどを修正するとデータにユーザが入力が含まれているとプログラマが意図しないJavascriptが実行できます。要はクライアントサイドのJavascriptインジェクション攻撃の事です。 Javascriptは非常に柔軟な言語で便利な反面、セキュ

teppeis 2011/11/04

リンク

JavaScriptの動かないコード　(中級編)　clickイベントを強制的に発生させたい　（fireEvent/createEventの使い方） - 主に言語とシステム開発に関して

連載目次へ以下のJavaScriptコードが意図した動作をしないのは，なぜですか。︵制限時間1分︶やりたい事‥ ﹁クリックするとメッセージを表示する﹂という，テキストボックスがある。このテキストボックスの動作テストをしたい。クリックのイベントを自動的に発生させ，ちゃんとメッセージが出るかをコードで確認する。 <body> イベントの発生源となるテキストボックス‥ <input type="text" onclick="onclick_func()" id="my_text"> click時に，ここにメッセージが表示されます。 <div id="my_div"></div> テスト‥ <input type="button" onclick="test_onclick()" value="onclickの単体テストを実行"> <script language="JavaScript">

teppeis 2011/04/12

リンク

"遅いブログパーツを高速表示する方法"を検証する | ゆっくりと…

かん吉さんの記事﹁遅いブログパーツを高速表示する方法﹂、すばらしいですネ。アフィリエイトをやっている人にとっては、とても興味を引く記事だと思います。ですが、紹介されているスクリプトは、中級以上の方が対象とあるように、私のような初級者が知っておくべきことがあるはずです。そこでまず私自身が中級者以上となるために、過去3回に渡り自分なりにブラウザの動作を勉強してきました。ブラウザ動作の理解－レンダリングツリーの構築と描画のタイミングブラウザ動作の理解－リフローとリペイント及びその最適化ブラウザ動作の理解－レンダリングの負荷を測るそこから見えてきたのが、レンダリング・ツリーの役割りです。ブラウザの本質は、ドキュメントとその見た目︵ビュー︶の管理です。前者は、文書自体やその構成の管理に責任を負い、後者は、描画について責任を負う。そして、両者のコラボレーションによりユーザーに情報を

teppeis 2011/03/30

「setTimeout を使っても onload イベントがブロックされることがある」

リンク

文字列からHTMLDocumentを作成するコード

必要に迫られて引数で渡された文字列から HTMLDocument を動的に作成するコードを書いたので紹介します。このコードはchromeコンテキスト上で、つまり拡張上で動作させることを前提としていますのでご注意ください。下記コードを書く際にmodestで紹介されているnanot_viさんのサイトを参考にしました。またrange.createContextualFragment()実行時のセキュリティ上の課題を克服するためにkazさんのblogを参照させていただきました。 let getDOMHtmlDocument=function(str){ let doc; let range; if(document.implementation.createHTMLDocument){ // Firefox 4.0から doc=document.implementation.createHTML

teppeis 2011/03/10

createHTMLDocument

リンク

第6回　JavaScriptとHTMLとDOMの基本#1 | gihyo.jp

こんにちは、太田です。前々回、前回とJavaScriptの基礎的な部分を解説しました。今回はJavaScriptからみたHTMLを中心に、DOMについても少しずつ解説しています。 JavaScriptとHTML FirefoxのアドオンやサーバーサイドJavaScriptなどの例外をのぞいて、多くのJavaScriptはHTML上で実行されるので、HTMLは土台となる重要な要素です。そこでHTMLの基礎的な部分からHTMLとJavaScriptの関係を解説します。 DOCTYPEとレンダリングモード HTMLといえば最初に書くのはDOCTYPEです。現在使われているDOCTYPEはHTML4.01、XHTML1.0、XHTML1.1といくつかの種類があり、さらにその中でTransitionalやStrictなどの違いや、XHTMLではXML宣言の有無︵本来は必須ですが︶などバリエーションが

teppeis 2010/05/25

リンク

HTMLDocument の動的な作成: Days on the Moon

ブラウザ上で、JavaScript を使って HTML のソースから HTML 文書を生成するのに、どんな方法があるのか調べました。なお、以下のスクリプトは HTML 文書上で実行することが前提です。表の見方 XSLT の HTML 出力 createHTMLDocument メソッド createDocument メソッド createDocument メソッドと名前空間の指定 createDocument メソッドと文書型宣言の指定 createDocument メソッドと文書型宣言及び名前空間の指定 cloneNode メソッド iframe 要素 ActiveXObject CID からの作成まとめ表の見方以下の表において、各項目の意味は次の通りです。 doc HTML 文書を作成できれば○、XML 文書を作成できれば△、それ以外なら×です。HTML 文書かどうかは、cre

teppeis 2009/10/29

リンク

はてなブックマーク

タグ

関連タグで絞り込む (5)

javascriptとdomに関するteppeisのブックマーク (9)

お知らせ

今週のはてなブックマーク数ランキング（2024年7月第2週）

はてなブックマーク透明性レポート（2024年 2月-2024年4月）

今週のはてなブックマーク数ランキング（2024年7月第1週）

公式Twitter

キーボードショートカット一覧

はてなブックマーク

公式Twitter

はてなのサービス