(function($) {})(jQuery);って何？って思ったからいろいろ試してみた記録 - お勉強orz日和
どうでもいい話なのですが、inputタグのautocomplete属性について先日はじめてちゃんと知った気がしました（今更 それと日記見返すと、昔の方が雑記的だなぁと思った。。 うーん、そう考えるとローカルのもったいないメモは多そうだ。 今度書き出せたらいいなぁ。。 で本題ですが、先日jQueryを使っているプラグインのコードを見てて「(function($) {})(jQuery);」ってどういう意味？て思ったので、調べたりとかしてました。 謎って思ったのはおおまかに３つ。 何故全体を括弧で囲む必要があるのか。 function($)の「$」って何？ ２個目の括弧の中の「jQuery」って何？ これ、ほぼ「(function($) {})(jQuery);」の全てが謎っていってるようなものですねw http://q.hatena.ne.jp/1226297257 上記のURL先を参考にな
Masato Kinugawa Security Blog: CVE-2020-11022/CVE-2020-11023: jQuery 3.5.0で修正されたSecurity Fixの詳細
English version is here: https://mksben.l0.cm/2020/05/jquery3.5.0-xss.html 先月、jQuery 3.5.0がリリースされました。 このバージョンでは、僕が報告した問題がSecurity Fixとして含まれています。 jQuery 3.5.0 Released! | Official jQuery Blog https://blog.jquery.com/2020/04/10/jquery-3-5-0-released/ 報告したバグは、CVE-2020-11022、 CVE-2020-11023 として採番されています。 https://github.com/advisories/GHSA-gxr4-xjj5-5px2 https://github.com/advisories/GHSA-jpcq-cgw6-v4j6
jQueryで設定されたクリックイベントなどを定義している場所を調べる方法 - Qiita
Chromeなどのモダンブラウザであれば、デベロッパーツールがあってJavaScriptのデバッグなどもそこで容易にできる。例えば、なんかのボタンにJavaScriptでクリックイベントを設定している場合、なにが設定されているかの確認もサクッとできる。 デベロッパーツールで、イベントの中身を確認 <div id="click1">click1</div> <script> var click1 = document.getElementById('click1'); click1.addEventListener('click', function() { console.log('click1'); }); </script> Command + Option + i のショートカットで起動 調べたい要素を選択し、右側のパネル「Event Listeners」を選択する 右端のフィルタっ
Managing jQuery plugin dependency in webpack
I'm using Webpack in my application, in which I create two entry points - bundle.js for all my JavaScript files/codes, and vendors.js for all libraries like jQuery and React. What do I do in order to use plugins which have jQuery as their dependencies and I want to have them also in vendors.js? What if those plugins have multiple dependencies? Currently I'm trying to use this jQuery plugin here -
Turbolinks再考 - nisshieeのブログ
この記事はnisshiee.orgに移設しました。 自動でリダイレクトします。 この記事は、「Speee Advent Calendar 2016」の4日目です。 3日目は、@Kosaku_Hidaより、「Google Spread Sheetに記載した複数URLのPage Speed Insightsの点数をGoogle Apps Scriptで取得する方法*1」です。 今日は、Turbolinksを考え直してみます。 みなさん、Turbolinks好きですか？ Rails使ってる人には、結構嫌われてる印象ですが、いかがでしょう？ Railsエンジニアに嫌われるTurbolinksの図 なんで嫌われたかというと理由はいたってシンプルで、既存の資産が動かなくなったからです。 という、なかなか悲しい歴史を持ったTurbolinksですが、改めて考え直してみようということで、まずはTurbol
Ruby on RailsのAjax処理のおさらい - Qiita
何気に、アプリケーションで取り扱うデータ量が増えた場合や、大容量データをデータベースとやり取りする時なんかは、Ajaxを使ってデータ通信をバックエンド側に押しやることで、WEBフロント側のUXからパフォーマンスの悪さを改善できたりする。また、ネットワーク経路的にproxyサーバとかを中継するような環境間でデータのやり取りをする場合などに、proxy側で接続時間にリミットがかけてあったりすると、通常アクセスではデータ通信時間がリミットに達して503エラーとかになってしまうような処理でもAjaxで通信をバックエンド化することで、回避できたりもするのだ。 通信帯域が小さいスマートデバイスが主力である今のご時勢、Ajaxによる非同期処理は、言語やフレームワークを問わずに必須な技術になっている。 私の主力スキルはPHPなので、PHP＋JavaScript（jQuery）やWordPressでのAja
特集：jquery.jsを読み解く｜gihyo.jp … 技術評論社
運営元のロゴ Copyright © 2007-2024 All Rights Reserved by Gijutsu-Hyoron Co., Ltd. ページ内容の全部あるいは一部を無断で利用することを禁止します。個別にライセンスが設定されている記事等はそのライセンスに従います。
Masonry
What is Masonry? Masonry is a JavaScript grid layout library. It works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. You’ve probably seen it in use all over the Internet. Install Download CDN Package managers Getting started HTML CSS Initialize with jQuery Initialize with Vanilla JavaScript Initialize in HTML Next MIT Lice
jQueryで楽になる部分、楽にならない部分、顧客が本当に必要だったもの - Qiita
俺も昔はお前のような jQueryスパゲッティジェネレーターだったのだが、膝にReactを受けてしまってな… 基本的な方針 とくにライブラリ設計者において、小さなモジュールを単機能で分割する以上、ライブラリ設計者は可能な限り依存を減らすことを求められます。node環境ならdependency hellの回避のため、フロントエンド環境ならファイルサイズを減らすためです。 ライブラリ設計者ならずともコードのポータビリティを維持するため、できるだけライブラリに依存しないコードを書くのが望ましいです。 Githubみてる限り、最近書かれるJSのライブラリの多くはjQuery非依存です。ユーザーから見る限りは、jQueryElement渡すかHTMLElement使うかぐらいの違いですけどね。 また、Angular, React等のSPAをスクラッチで設計する場合、気づいたらjQueryを使っていな
You Don't Need jQuery - Qiita
注意とお願い この記事の内容はもはや古いです。ここに書いている方法では動かないものをいくつか見つけました。参考にする際は動作をよく確認してから使ってください。 ひとつお願いがあります。「あれ、動かないぞ」というコードを見つけたら是非コメントか編集リクエストで教えてください。解決方法までなくても結構です。「これはもう動かないよ」という印をつけたいのです。 この記事はYou Don't Need jQueryの日本語訳と同じ内容です。 先日ひょんなことからYou Don't Need jQueryの日本語訳をさせていただきました。著者のCam Songさんからも快諾をいただけたので1、Qiitaでも公開させていただきます。 なお、本家の英語の説明は継続的にメンテされているので、この記事の情報は古くなっている可能性があります。 追記 この記事は当初は「もうjQueryは必要ない」というタイトルで
jQuery から卒業するための第1歩を polyfills から学ぼう
2014/01/31 | lastmod: 2024/06/29 この記事は書かれてから1年以上が経過しており、最新の情報とは異なる可能性があります techJavaScriptjQuerypolyfills （2024 年追記）古い記事なので誰も見てないと思いますが、現在 polyfills を使うのは危険なのでやめましょう。もはや機能が足りなくて困るケースはないようなので、使う意味もないかと思います。 https://www.itmedia.co.jp/enterprise/articles/2406/29/news057.html （追記終わり） jQuery というライブラリは非常に便利な JavaScript ライブラリであります。 jQuery 便利！いやー、便利ですよね。便利すぎて、JavaScript を書いて HTML 要素を何かしようと思ったときに、無条件で使用してしま
【jQuery】.on() の使い方（jQuery1.7～） at softelメモ
jQuery1.7から、.bind()、.live()、.delegate()などは非推奨となり、.on() が推奨となりました。今後すべてのイベントは .on() で、となっていきそうですが、なにやら引数が多くて分かりにくい感じ？では使ってみましょう。 １、$(セレクタ).on(イベント, 関数) セレクタにマッチした要素で、イベントが発生すると、関数が実行されます。 = .bind() ですね。 「セレクタにマッチした要素に」なので、そこにある要素に対してとなり、後から動的に追加した要素に対しては効きません。 example $('#example-button').on('click', function(){alert('clicked!');}); Demo デモ – $(セレクタ).on(イベント, 関数) ２、$(document).on(イベント, セレクタ, 関数) do
jQueryが10周年とのこと - rochefort's blog
いやぁ、すごいですね。10年もJS界隈で生き残るなんて。 JSer.info を見ていたところ 10周年としてjQuery3.0のbeta版リリースの案内が記載されていました。 jQuery 3.0 Beta Released | Official jQuery Blog また、jQueryのversion表記ですが、以下のようになるとのこと。 少し古いWeb+DBを見ていて気付きました。 jQuery は次期リリースから 1.x 系、2.x 系共にメジャーバージョン番号を jQuery 3.x で統一へ | WWW WATCH jQuery 3.0」、1.x 系の後継を 「jQuery Compat 3.0」 あと、作者のブログを見ていると過去のjQueryのコードに対してコメントを付けて公開しているものがありました。 冒頭読んだだけだけど、面白そうなので、あとでじっくり読もう。 Gen
jQuery 3.0 Beta Released | Official jQuery Blog
The time has come. On this day, the 10th anniversary of jQuery, jQuery 3.0 has reached beta status. Last week, we announced the last minor releases to the 1.x and 2.x branches. Those branches will continue to receive patches for a limited time (i.e. only major regressions or bugs); jQuery 3.0 is the future. If you need IE6-8 support, you can continue to use the latest 1.12 release. The Death of jQ
John Resig - 10th Anniversary of jQuery
Today marks the 10th anniversary of the release of jQuery. I announced it back at BarCamp NYC 2006 when I was still in college. It’s incredible to think of how far it’s come and just how many people have contributed to its success. To them I am forever grateful, thank you. Last year I wrote up an annotated version of the original jQuery release in which I dumped many of my thoughts regarding the w
Ten Years of jQuery and Beyond | Official jQuery Blog
On the 14th of January 2006, John Resig went to an event called BarCamp NYC to talk about some of the projects he was working on. One of those projects was a JavaScript Library called jQuery. It was the birth of what has become the most widely used JavaScript library ever written. It’s hard to imagine now, but there were already about a dozen JavaScript libraries around on that day when John annou
jQueryを読み解く3（contextについて） - rochefort's blog
前回確認した contextについて、以下の参考記事を元にbenchmarkを取ってみました。 今回はcode readingなしです（全然進みません）。 参考記事 Brandon Aaron「誤解されてるjQueryの"Context"」 - 以下斜め読んだ内容 こちらの記事が詳しく、興味深いです。 benchmarkの取り方 以下の簡易的に計測するメソッドを用いてブラウザのconsole上で計測しています。 （もっといい方法があれば教えて下さい。） 対象ブラウザは、chrome(45.0.2454.85 (64-bit))、Firefox(40.0.3)です。 IEとかAndroidとかで計測すると、いろいろ違ってくるのかもしれませんが面倒なので実施して無いです。 対象サイトは、http://api.jquery.com/ で、 id=post-45 要素の配下にある header タ
jQueryを読み解く2（40〜90行目） - rochefort's blog
前回 は、コードリーディング速攻でやめてしまったので 今回はもう少し読んでみます。 変数定義 40〜62行目 よくわかりませんが、Array、Hashのmethodを切り出しています。Firefoxの対応のようです。 // Support: Firefox 18+ // Can't be in strict mode, several libs including ASP.NET trace // the stack via arguments.caller.callee and Firefox dies if // you try to trace through "use strict" call chains. (#13335) // var arr = []; var slice = arr.slice; var concat = arr.concat; var push = ar
jQueryを読み解く1（〜38行目） - rochefort's blog
いろいろ整理中に、あとで読もうと思っていた以下の記事を久しぶりに目にしました。（7年ぶりくらい） jquery.jsを読み解く：特集｜gihyo.jp … 技術評論社 jQueryはオワコンだとかよく聞きますが、単純なWebではまだまだ使われるでしょうし （脱jQueryするにはもう少し時間が掛かるかと思います） jQueryのソースはほどんど読んだことがなかったので、ちょろっと読んでみることにしてみます。 Introduction 第1回 jQueryライブラリ（1～171行目）：jquery.jsを読み解く｜gihyo.jp … 技術評論社 こちらの記事は、v1.2.2 で当時は、93KB 程度のようでしたが 今の最新はv2.1.4で248KB に膨れており行数的にも約3倍ほどになっています。 読んでみます（〜35行目） (function( global, factory ) { i
jQueryプラグインのCommonJSモジュール化からnpmに公開するまでの方法
npmでは先月よりjQueryコミュニティのサポートを開始しました。そのニュースを受けて前回の投稿『npmで公開されているjQueryプラグインを使う with Browserify & parcelify』では、Webアプリを開発する際に、npmで公開されているjQueryプラグインを使用する方法を紹介しました。いわばWebアプリ開発者向けの記事でした。今回はjQueryプラグインの作者向けの記事となります。実際に開発されているjQueryプラグインをnpmに公開する方法をご紹介します。 npmはじめに: jQueryプラグインの公開は「The jQuery Plugin Registry」から「npm」へjQueryのプラグイン登録ページ『The jQuery Plugin Registry』にアクセスすると、以下の記載があります。 We recommend moving to npm
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
