Vue.jsで10万件のリストを表示する - Qiita
はじめに Vue.jsは軽量ですが、数万件のリストを並べるとそりゃ普通につらい。 だから目に見えるとこ以外はdom描いてもらうのやめるってコードです。 デモ デモ(jsfiddle) コード <div id="app"> <div style="overflow:auto;height:170px;" @scroll="getScrollParam"> <ul :style="listStyle"> <li style="height:17px" v-for="num in displayList">{{num}}</li> </ul> </div> </div> new Vue({ el: '#app', data: function(){ return { list:list, scroll:0,//スクロール量 scrollMax: (list.length - displayRow
あなたがReactを使うべき理由 - mizchi's blog
最近フロントエンドでfacebook/reactをずっと使っている。世界的には一部のエンジニアの間で流行っているのだが、国内だとqiitaのタグ等を見てもどうも少ない。みんなもっと使うべきだと思うので、宣伝かねて意見をまとめてみる。 複雑化するデータバインドに対する懸念 MVWのVに対して思いを馳せると、だいたい次のことに行き着く。すなわち、「ある構造体の入力に対して、必ず一意なビューを生成したい」 {items: [1, 2, 3]} を入力とすると、 1, 2, 3のli要素になってほしい。これは単純な例だから問題に成り得ないように見えるが、アプリケーション全体の状態を一つのjsonとして定義し、 そこから常に0から組み立てればアプリケーションの健全性が確保できると考えたことはないだろうか？ 現実の問題 UIのだいたいの状態は遷移で表現される。遷移の差分をプログラマが記述する。jQue
「Webスクレイピング」に関する参考記事へのリンクを我武者らにまとめてみた。リンク31個+スライド5個。 - おしブロ from STONEWEB
そろそろ本気で「Webスクレイピング」に取り組まなければならない気がする今日この頃、Webスクレイピングに関してググって見つけた参考記事へのリンクをシンプルに羅列してまとめてみました。 ちなみに「Webスクレイピング」については、以前書いた記事「Webスクレイピングとは何ぞや？という疑問が浮かんできたので調べてみた」を参照してみて下さい。 参考記事リンク31個まとめ （PHPでのスクレイピングとか） 初めてのスクレイピング - しぶてぃーぶろぐ » PHP初心者がやってみた！スクレイピング入門｜inimoni PHPでphpQueryを使ってWebスクレイピングしてみる - omiya6048's blog 誰でもスクレイピング！DOM要素を引っこ抜くSimple HTML Dom-ITかあさん ウェブ上の必要なデータを抽出する方法-スクレイピング- | PHPサンプル実験室 PHPでのス
文字列から要素を作りたいときはinnerHTMLではなくcreateContextualFragmentを使う - 素人がプログラミングを勉強していたブログ
追記：ベンチマークをコメントを元に修正 文字列から要素を作りたい場合、 var temp = document.createElement('div'); temp.innerHTML = '<span>foo bar fizz buzz!</span>'; とやることが多い。 だが、不要なdiv要素ができて気持ち悪いし、for文でchildNodesをひとつずつ処理する必要があって、不便。 divの中にhead要素を入れることはできないので、innerHTML=''としても、要素は作られない。 RangeのcreateContxtualFragmentを使うと、こういった問題を避けることができる。 例えば、上のコードをcreateContextualFragmentを使って書き直すと、 var range = document.createRange(); range.createCon
JavaScriptの動かないコード (初級編) DOM要素の配列を，forループで順番に全削除できない - 主に言語とシステム開発に関して
連載目次へ 以下のJavaScriptコードが意図した動作をしないのは，なぜですか。（制限時間１分） やりたい事： DOM操作により，div要素を全て削除する。 <body> <input type="button" value="DIV要素の削除を実行" onclick="f()"> <div>1</div> <div>2</div> <div>3</div> <div>4</div> <div>5</div> <script> function f() { // 全要素を取得 var arr = document.getElementsByTagName("div"); for( var i = 0; i < arr.length; i ++ ) { var elem = arr[i]; // 一つずつ削除 elem.parentNode.removeChild(elem); } }
JavaScriptのDOM Core基礎 - 三等兵
Coreの簡易リファレンス。Coreは要素を参照したり、相対位置から周りのノードを参照したり、要素を生成するといった部分。主に利用するであろうプロパティやメソッドはカバーしているつもりですけど、これも入れとけってのあったら教えてください。 このあたりは地味で使いづらくその上理解しにくいという残念な部分。ふと忘れたときに使う個人的なものですが、慢性jQuery拒絶症候群な人よかったらどうぞ。それにしても暑い。ガリガリ君おいしいね。 DOMとは。 Document Object Model (DOM) は、HTML および XML ドキュメントのための API です。これはドキュメントの構造的な表現を提供し、内容や表示形態の変更を可能にします。端的に言えば、Web ページをスクリプトやプログラミング言語とつなぐような機構です。 https://developer.mozilla.org/ja/
JavaScript での XPath の利用の手引き - XPath | MDN
const xpathResult = document.evaluate( xpathExpression, contextNode, namespaceResolver, resultType, result, ); evaluate() 関数は 5 つの引数を取ります。 xpathExpression: 評価する XPath 式を文字列で指定します。 contextNode: xpathExpression を評価する対象となる文書内のノードを指定します。指定されたノードの全ての子ノードに対しても評価が行われます。もっともよく使用される値は document ノードです。 namespaceResolver: xpathExpression に含まれるあらゆる名前空間接頭辞を渡され、その接頭辞に対応する名前空間 URI を表す文字列を返す関数です。この関数により、 XPath 式で使
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://msugai.fc2web.com/java/XML/DOM.html