node.jsを使ってjQueryチックにWebサイトをクローリングする方法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
どうも僕です。 今日は、サーバサイドJavaScript（node.js）でjQueryチックにDOMを操作して、Webサイトをクローリングする方法についてまとめようと思うよ！ 要は、既存のWebサイトから必要な情報を収集してきて、データベースに突っ込もうということ。 これができると何がうれしいかって、簡単にまとめサイトが作れるんだよね。 クローリングする方法は数々あれど、なにゆえサーバサイドJavaScriptのnode.jsを使ってこれをするかというと、「クローリング対象の部分をjQueryのセレクタで指定できる」のが大きいわけです。 みんな、好きだよね！jQuery！とっても便利だよね！jQuery！ 好みにもよるかと思うが、JavaScriptのようなふにゃふにゃした言語をあえて使う理由は、クライアントサイドプログラミングを組むか、JQueryの恩恵を受けるためといっても過言ではあ
JavaScriptとコールバック地獄 - Yahoo! JAPAN Tech Blog
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog Yahoo!デベロッパーネットワークの中野(@Hiraku)です。JavaScriptでサンプルコードを書く機会があったので、どんなインターフェースで提供するのが便利なのか考えてみました。よく問題になるコールバックのネスト問題について、一般的な話をまとめてみます。 お題 突然ですが、次のような処理を行う必要があるとします。 「0」を出力する 1秒待つ 「1」を出力する 1秒待つ 「2」を出力する これをプログラムで書くとどうなるでしょうか？ シェルスクリプトの場合（同期） たとえばシェルスクリプトで素直に書くと、次のようになります。
RequireJSでTwitter Bootstrap（jQuery）を非同期ローディングしてみる | DevelopersIO
こんにちは、すどーです。 RequireJSでjQueryやjQueryプラグインの非同期ローディングを試してみました。 最近は大規模な構成になると、「ちぢめる、まとめる、かためる（minify, combine, compress）」のが主流のようです。 ですが小中規模な構成や、依存関係にあるフレームワークなども多くあるので、簡単な使い方だけでも覚えておくと便利かと思います。 RequireJS： http://requirejs.org/ RequireJS API： http://requirejs.org/docs/api.html RequireJSの主な特徴 モジュール化（AMD APIをサポート） 非同期ローディング OPTIMIZERによる最適化 1. モジュール化（AMD APIをサポート） AMD(Asynchronous Module Definition)はComm
2013-01-29のJS: QUnit 1.11、アンチパターンでみるTestable JavaScript、jQueryのDeferredとPromise
Jser.info #107 - QUnitが久々がアップデートがでてQUnit 1.11がリリースされました。新たなスタートを切った感じで公式サイトも最近新しくなったので、改めて覗いてみるといいかもしれません。 Writing Testable Frontend Javascript Part 1 – Anti-patterns and their fixes | Shane Tomlinsonという記事で、テストしにくいコードを例にそれをどう改善していくとテストしやすくなるかについて書かれています。 色々な要素について触れていてよい記事だとおもいます。 jQueryのDeferredとPromise - tkawachi Blogという記事では、jQueryでのDeferredとPromiseがどのようなものなのかについて簡潔に書かれています。変に図やコードがなく、状態の遷移について書
JavaScriptのthisの覚え方 - Qiita
JavaScriptのthisは同じソースコードでも呼び出し元次第で意味が違ったりして複雑だと思われがちだけど、一回覚えてしまえば簡単だ。 JavaScriptにはthisが4種類ある これだけをしっかり覚えておけば、後は必要な時に 4種類って何があるんだっけ？ と考えれば容易に思い出せる。 ちなみに、下記のコードはブラウザ上で実行することを想定している。(なのでwindowを使う) トップレベルのthis グローバルオブジェクトを指す。 var hoge = "fuga"; window.foo = "bar"; // fuga+bar と表示される console.log(this.hoge + "+" + this.foo); (function(){ // 同じくfuga+bar と表示される console.log(this.hoge + "+" + this.foo); })(
愛宕山太郎坊/Staff
愛宕山太郎坊 アニメーション制作進行支援ソフト 愛宕山太郎坊 ログイン 会社id ユーザー名 パスワード ユーザー名またはパスワードが正しくありません。 閉じる ログイン
Attributes | jQuery リファレンス
jQueryで属性を操作するためのメソッドの一覧です。 removeProp() removeProp()は要素からporp()でセットされたプロパティを取り除くメソッドです。 prop() prop()は要素のプロパティの真偽値を取得できるメソッドです。 val() val()は入力フォームの値を取得/変更できるメソッドです。 toggleClass() toggleClass()はclass属性の取り外しを制御するメソッドです。 hasClass() hasClass()は要素が特定のclass属性の値を持っているかどうか調べることができるメソッドです。 removeClass() removeClass()は要素のclass属性の値を削除するメソッドです。 removeAttr() removeAttrメソッドは要素から属性を取り除くメソッドです。 addClass() addCla
パララックス制作などで使えるスクロールして特定の位置でアニメーションなどの処理を実行させることが出来るjQueryプラグイン「jquery-peekaboo」「jQuery Waypoints」｜BLACKFLAG
パララックスサイト制作の際などで活用できる ページ内の特定のスクロール位置でアニメーションなど何か処理を実行させることが出来る jQueryプラグインがいろいろ使い道がありそうだったので 自分用のメモ書きとして紹介してみます。 uniba/jquery-peekaboo・GitHub 使い方はとても簡単で ページをスクロールしてアクションを実行させるポイントになる箇所に対して 下記のような記述で処理を実行させます。 ◆SCRIPT $(function(){ $('.point').on('appear',function(){ $(this).css({opacity:'0'}).stop().animate({opacity:'1'},1000); }); }); この記述の場合は、ページをスクロールして 「.point」とクラス付けされた要素の位置に辿り着いたら その要素に対してフェ
jQueryのDeferredとPromise - tkawachi Blog
JavaScript(というか CoffeeScript)って90年代にブラウザ上で使われていた頃のイメージが拭えず、どうも気持ち悪くて逃げて回ってたんですが、事情があって最近は渋々書いてます。 JavaScripterの皆様にとっては何を今更だとは思いますが jQuery.Deferredを使って楽しい非同期生活を送る方法 を読んで Deferred 便利だな、と思ったので理解したところをメモしておきます。 利用シーン $.get() ってエラーハンドリングできないのか。使えないなー。と思ったとき 複数の AJAX リクエスト(などの非同期処理)を同時に開始して、全部終わったら何かしたいとき。 Deferred object キーになるのは Deferred object です。 状態 Deferred object は状態を持ちます。状態は３つのうちいずれか。 未解決(unresolv
ECMAScript6について | ryuone's memo
最近何かと、成長が著しいJavaScriptの仕様ECMAScriptの勉強会(#jsdokusho)が1月19日(土)にあったので参加してきました。その2日前に東京でWeb先端技術味見部#15 （今回は「ECMAScript6をそろそろ触る」！）[Web先端技術味見部]があったので、味見の味見となりました。ものすごく勉強になったので、頭の中に入った事を纏めようと思います。 1: let, constについて 1.1: let letはvarと同じsyntaxだが、block scopeが異なる。 function test_let(){ let x = 0; if(true){ let x = 1; console.log(x); // => 1 } console.log(x); // => 0 } test_let() let a = 1; console.log(a); // =>
data-transition | jQuery Mobile リファレンス
ページ遷移時のアニメーションエフェクトを設定できるdata-transition属性は属性の一覧です。 none a要素にdata-transition=”none”を指定するアニメーションせずにページ遷移を行います。 slidedown a要素にdata-transition=”slidedown”を指定するスライドダウンアニメーション(次ページが上からスライドインして表示)でページ遷移を行います。 slideup a要素にdata-transition=”slideup”を指定するスライドアップアニメーション(次ページが下からスライドインして表示)でページ遷移を行います。 slide a要素にdata-transition=”slide”を指定するスライドアニメーション(ページがスライドアウトして次ページがスライドインして表示)でページ遷移を行います。 slidefade a要素にda
Boolean | JavaScript リファレンス
真偽値を取り扱うBooleanオブジェクトのメソッドの一覧です。 valueOf() BooleanオブジェクトのvalueOfメソッドは真偽値を返します。 toString() Booleanオブジェクトの真偽値の文字列を返します。
World Wide Deb
The first signs of mounts may appear in adolescence, with more severe development around 30-40 years. It is a deformity in the bone of the big toe, which deviates to the other toes and thus produces a prominent formation, in many cases being painful. It is not possible to say precisely what the cause is,…
身につけておきたいWebサイト高速化テクニック #2｜検証ツールとそもそもHTTPって何だ編 | DevelopersIO
第1回のアジェンダ編では、高速化に関わる要因と解決策の全体像を紹介しました。 アジェンダ編にもかかわらず多くのブックマーク、シェアをいただきありがとうございます！ 余談ですが、記事にブックマーク、シェアをしていただくと、このブログでは執筆者に経験値がたまるような仕組みになっています。 たくさん経験値を貯めると四半期ごとに良いことがあるかもしれないので、気が向いたらこの他の執筆者の記事もシェアしていただけるとうれしいです。 言葉にせずとも、わかっていただけると思いますが、この記事も・・・ね？ 右上にあるボタンをちょちょっと。 本題 余談はさておき、本題に入りましょう。 今回は「無駄なリクエストとレスポンスの削減」に視点を置き、解決策について調査、計測して紹介してみたいと思います。 と思ったのですが、長くなりすぎたため、まずは「検証ツールとHTTPについて」紹介することにしました。 この記事の
初期設定 | jQuery Mobile リファレンス
jQuery Mobileで設定可能な初期設定の一覧です。 initSelector $.mobile.button.prototype.osptions.initSelectorはボタンとして初期化を行う要素のセレクタを設定できるプロパティです。 transitionFallbacks $.mobile.transitionFallbacks.[transition]はブラウザのアニメーションエフェクトのフォールバックの設定です。 touchOverflowEnabled $.mobile.touchOverflowEnabledはページ遷移時のアニメーションや固定配置をよりスムーズにする設定です。 subPageUrlKey $.mobile.subPageUrlKeyはウィジェットがサブページを作成する際のURLパラメーターを指定できる設定です。 phonegapNavigation
jQuery 1.9.0 での変更箇所の自分なりのまとめ | 私的なjQuery他
jQuery 1.9.0 のリリースノートを読んで、自分なりにまとめました。 誤訳して間違ったことをまとめてる可能性も否定できないので 読まれる際はご注意下さい。（※ページをそのまま訳したわけではありません） 箇条書きにすると以下のような感じ： 1.9 と 2.0 について API の整理 .css([name1, name2, ...])で複数のプロパティの値を一度に取得可能に CSS3 のセレクタのサポート .finish()の導入 ソースマップのサポート 1.9 と 2.0 について jQuery 1.9 と 2.0 は同じ API を持ちます。しかし、2.0 の方は IE 6-8 のサポートを行いません。1.9 では引き続きサポート されます。そのため、IE 6-8 が自サイトの対象ブラウザに 入っている場合は 1.9 を使用することになります。 jQuery チームは 1.9 と
jQueryとCSS3を使ったアコーディオンメニューを詳しく説明します｜Webpark
jQueryとCSS3を使ったアコーディオンメニューを作ってみましたので、作り方を紹介します。かなり長くなりますが、お役に立てばうれしいです。 色々事情があってIEでご覧になっている方のためにスクリーンショットも載せておきます。カテゴリー３にマウスを乗せているところです。 それではコードを解説していきます。 HTML まずはHTMLです。無駄に長いですが一応載せます。 <ul id="accordion"> <li><a href="#">カテゴリー１<span class="arrow rotate"></span></a> <ul id="active"> <li><a href="#">サブカテゴリー１</a></li> <li><a href="#">サブカテゴリー２</a></li> <li><a href="#">サブカテゴリー３</a></li> </ul> </li> <l
Firefox OS - naoyaのはてなダイアリー
Firefox OS が面白そう、というので少し触ってみました。 Firefox OS はWeb 標準ベースの開発を基礎としたモバイル端末用プラットフォーム、要は HTML と JavaScript と CSS でアプリケーション開発できるモバイル端末用の OS。間もなく Developer Preview Phone な実機が発売されるというのでにわかに盛り上がりを見せているみたいです。 Firefox OS が目指すところは Web 標準による、開発者がロックインされないオープンなプラットフォーム。iOS や Android の昨今の状況を見れば、そのアンチテーゼになるプラットフォーム構想があってもおかしくないわけで、まさにそれを目指しているようですね。 いったいどんなものかという概観は dynamis さんによるスライドが分かりやすい。 Firefox OS from dynamis
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
その他 | jQuery Mobile リファレンス
mgzl.jp