そろそろ、find()・children()・closest()・parent()・parents()・filter() を迷わず使いたい - Qiita
そろそろ、find()・children()・closest()・parent()・parents()・filter() を迷わず使いたいjQuery初心者 「も〜、、、 何回同じこと調べるねん！」 ということで、自分のためにも覚書です。 「find()とfilter()ってどう違うんだっけ？」 「closest()ってセレクタ自身も取得対象に含んでたっけ？」 この曖昧な記憶をスッキリさせたいと思います。 find()・children()・closest()・parent()・parents()・filter()それぞれの違いと使い方 セレクタ付近の要素を取得するために使うjQueryのメソッドは、大きく分けて ① 子・孫要素を取得するメソッド ② 親・祖先要素を取得するメソッド ③ 指定した選択肢の中でフィルタリングをかけて取得するメソッド の3つに分類できるかと思います。 ① 子・孫
jQueryのイベント設置: セレクタ指定の有無で何が変わる？ - Qiita
jQueryでイベントを設置・削除する際に.onと.offをよく使用します。 これらのメソッドの第二引数にセレクタを指定する場合としない場合の違いをまとめました。 1.jQueryでイベントを設置する jQueryでイベントを設置するには.onメソッドを使用します。 必須：eventsにはclickやkeyupなどのイベント名を指定 任意：selectorはイベントを発生させたいセレクタを指定 任意：dataにはイベントに渡したいデータを指定 必須：handlerはイベントが発生した際の処理を指定 1-1. セレクタを省略してイベントを設置する セレクタを省略する場合、例えばボタンをクリックしたときにアラートを表示するには以下のように書けます。
jQueryは1個の要素と複数個の要素を同じように書かせる - fsubal
「1個の要素と複数個の要素を同じように書かせる」というのが実は jQuery の特徴の一つだと思っている。 document.querySelector() や querySelectorAll が出現して以降 jQuery の必要性はほとんどなくなったと言われる。
デジタル庁でjQueryが何をしているのか - laiso
TL;DR: jQueryはDrupalのバーター リニューアルするたびにWeb界隈の一斉レビューを受けることでお馴染のデジタル庁ポータルサイトがいつの間にかまたリニューアルされていて、フロントエンドがNext.jsからDrupalに変わって話題になっていたので1、私も旅券所持者として国政に関心を持ってゆく また、まわりのフロントエンドエンジニアの間でjQuery氏の入庁について「モダンブラウザ全盛の時代に必要か？」と疑念がとなえられていたので、これも追求してゆきたい どのような変更があったのか システム変更の経緯はプロジェクトの関係者であるHal Sekiさんの発言が正確なところだと思う Drupalが話題ですが、元々CMS側は2年前からずっとDrupalだったんです。設立当初はサイトもシンプルだったのでフロントエンド側はNextjsでヘッドレス構成だったのですが、構成が複雑になってきて
Slim版も追加されたJavaScriptライブラリ「jQuery 3.7.1」リリース
JavaScriptライブラリ「jQuery」の公式ブログは、現地時間8月28日に最新版「3.7.1」をリリースしたことを発表した。 「jQuery」は、WebブラウザでのインタラクティブなUI表現をよりコンパクトに記述するためのJavaScriptライブラリ。最新版は「3.6.0」や「3.7.0」のアップグレードで発生したバグの修正がなされた他、スリムビルドを実現するajaxモジュールとエフェクトモジュールを除外した「スリム」バージョンがリリースされた。 修正点は主に2点で、Tableの行要素である<tr/>の寸法値がChrome及びSafariで丸められてしまう問題の修正と、セレクターエンジン「Sizzle」のインライン化に伴い一部非公開になっていたメソッドを復活させている。「スリム」バージョンは、ajaxが必要ないケースや多数のスタンドアローンライブラリ内の1つを使用したいケースなど
jQueryへの別れ：現代的な開発のための必須JavaScriptメソッド - Qiita
はじめに 私は長い間レガシーコードと共に仕事をしてきましたが、jQueryの重要性は依然として頻繁に話題に上がるトピックの一つです。ライブラリ自体は便利なままですが、それは別の時代のニーズを完璧に満たしていました。 現在、私たちは既にES2023について話していますが、過去にjQueryがカバーしていたほとんどの機能は、すでに2015年にリリースされたES6に取り込まれています。 ES6の標準は既に広範にサポートされており、96％のレベルに達しています（出典：caniuse.com）。そのため、特に要素の選択、スタイリング、アニメーション、データの取得などの基本的なタスクについては、ライブラリの使用を見直す良いタイミングかもしれません。 以下のトピックは、いくつかの標準的なjQueryのパターンと、それに相当するバニラJavaScriptでの手法を示す参考資料として役立つと思います。 要素
jQueryからVanilla JS（ピュアなJavaScript）に書き換える時によく使うもの - Qiita
Vanilla JSとは素のJavaScript、すなわち純粋なJavaScriptのことを言います。 jQueryで記述していたコードをVanilla JSに書き換える時によく使うものをまとめてみました。 セレクタ IDセレクタ ID名で要素を指定する。 構文
【脱jQuery】モダンなJSの書き方 - Qiita
はじめに 普段、Ruby On RailsでMPA（マルチページアプリケーション）による開発をメインに行っています。 最近「jQueryを使わない」という話しをチラホラ見かけるようになりました。その辺を調べていくうちに自分も「jQueryを使うのやめよう」と思いました。しかし、jQueryに慣れてしまっていて、プレーンなJSで書く方法がパッと出てこなかったので、その辺りを備忘録としてまとめてみました。 jQueryでよく使っていた機能 自社内のプロダクトでjQueryの利用状況をざっと見たところ、利用されている機能としては次のものが多かったです。 セレクタ Ajax イベント ループ それぞれプレーンJSでの記述例を書いておきます。 単一セレクタの例 jQuery
HTTPでHashやArrayを送る手法に仕様は存在しない……の? - ただのにっき(2013-09-15)
■ HTTPでHashやArrayを送る手法に仕様は存在しない……の? jQueryでこんなふうに書くと: $.post('/', { hash: { foo: 'hoge', bar: 'fuga'}, array: ['baz', 'piyo'] }); サーバ側でこんなふうに受け取れて(これはSinatra): post '/' do params.each do |key, val| puts "#{key}: #{val} as #{val.class}" end end ちゃんとHashやArrayとしてアクセスできる: hash: {"foo"=>"hoge", "bar"=>"fuga"} as Hash array: ["baz", "piyo"] as Array ああこりゃ便利だね、で済ましてもいいんだけど、HTTP POSTの中身なんてただのバイト列なんだから型の情
jQueryでフォームの値を取得する方法をまとめておくので、コピペでご利用ください。 | Ginpen.com
必要ならどうぞ。 デモ jQueryでフォームの値を取得する方法をまとめ – jsdo.it – Share JavaScript, HTML5 and CSS jQueryでフォームの値を取得する方法をまとめ – jsdo.it – share JavaScript, HTML5 and CSS 共通：要素の探し方 input要素なんかにid振っちゃうのが一番なんだけど、属性セレクターを使うと楽な場合があります。つまり[name=xxx]で検索するやり方。 <form id="my-form"> <input type="text" name="my-text" value="This is text." /> </form>
CSSは分かるけど jQuery は苦手 … という人が jQuery に親しんでくれるといいなーと思って書きました
Webデザインをしていると、HTML と CSS だけではできない表現ってありますよね。そんな時によく使うのが jQuery。今回は jQuery っていまいちよく分からない ... っていう人が、jQuery に少しでも親しんでもらえたらいいなーと思って、知ってる事をまとめてみました。なので jQuery 初心者さん向けの記事です。 とっても当たり前なんですけど、Web サイトは基本的に HTML で書かれていて、デザインは CSS で装飾されていますよね。最近では CSS3 の登場で、簡単なアニメーションも CSS で作れるようになりました。でもクライアントワークでは、まだまだ CSS3 を使える部分が限られているし、Webデザインに少し動きなどをつけたい時などは、まだまだ jQuery を活用する事も多いです。 私は Javascript が苦手で、jQuery もどちらかというと苦
jQuery 1.6.1 リリース
jQueryプロジェクトは、13日に「jQuery 1.6.1」をリリースした。3日には「jQuery 1.6」がリリースされており、今回発表されたjQuery 1.6.1は、jQuery 1.6系列の最初のアップデートとなる。 jQuery 1.6では、いくつかの処理の高速化とともに、.prop()メソッドが加わり、.attr()メソッドに変更が加えられた。その結果、バージョン1.5.2からバージョン1.6に変更した場合はコードの変更が必要になり、コミュニティ内では双方のメソッドの関連性について、議論が巻き起こる結果となった。 今回、リリースされたjQuery 1.6.1では、バージョン1.6で行われた.attr()メソッドに対する変更は破棄され、かつ従来の.attr()メソッドが抱えていたいくつかのバグが修正されている。この変更によってコードの書き換えは必要なくなり、バージョン1.5.
「ノンプログラマーのためのjQuery入門」のスライドが凄く分かりやすいですね - かちびと.net
Twitterに流れてきたスライドがとっても 分かりやすかったのでブログでより多く の方に拡散。ノンプログラマー向けの jQueryの基本講座。これからjQuery を使おう、という方は読んでおくと良さ そうですね。 ノンプログラマー向けにjQueryの基礎をスライド化してくれています。 @pocotan001さん作のスライドです。 このスライドを見ながらコーディングする、というより、基礎知識を頭に入れるのに適したスライドだと思いますので気軽にご覧になってみて下さい。ハードルがかなり下がると思います。 また、当ブログでもjQueryプラグイン等の情報を取りあえげていますので合わせてどうぞ。 jQueryのリファレンスサイトと入門書籍 [2011.09.21アップデート] よくアクセスいただくのでハブ的な役割くらいは果たそうと思います。 jquery / jQueryの本家です。 jQuer
jQueryのイベントをチュートリアルで学ぶ（前編） (1/6)
jQueryを使ったプログラムの基本的な要素として、セレクターと(X)HTML/CSSを操作する命令について解説してきました。今回はもう1つの重要な要素である「イベント」を紹介します。 命令が実行されるタイミングを決める「イベント」 これまで見てきたように、jQueryを使ったプログラムは、セレクターで特定の(X)HTML要素を指定し、(X)HTMLやCSSを追加・変更します。サンプルプログラムは理解しやすいように、Webブラウザーで開くといきなりプログラムが実行されるものでしたが、本来必要なのはサイト制作者が意図したタイミングで実行されるプログラムですよね。では、タイミングはどのようにして指定するのでしょうか？ たとえば、第1回で紹介したアコーディオンパネルは「ユーザーが特定の要素をマウスでクリックしたときに、要素の高さを変更する」プログラムでした。ほかにも、マウスオーバーで画像が切り替
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
東京渋谷 “HTML5入門＆jQuery” 勉強会(5/26)の資料を公開します | tonowp