そろそろ、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での手法を示す参考資料として役立つと思います。 要素
【JavaScript】DataTablesが超便利すぎる - Qiita
DataTablesとは DataTablesは、HTMLテーブルを対話的なデータグリッドに変換するためのJavaScriptライブラリ。 簡単に言い換えると、HTMLテーブルをソートや検索などがおこなえる高機能な表にできるということ。 拡張性 や 柔軟性 が高く、また大規模なデータを持つテーブルを操作するのにとても便利である。 導入 下記のリンクから自分の環境に合ったやり方でダウンロードしよう。また、基本的に jQuery は必須である。 最もシンプルな例 とりあえず簡単な実装例を挙げてみる。 ここでは理解できなくてもOK！ See the Pen DataTables by Tomoki Ota (@odlqzyes-the-sans) on CodePen. 使い方 これからDataTablesの使い方を説明していく。 最初は以下のcssとjsファイルだけでOK! (CDN以外の書き
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
JavaScript: 通常の関数とアロー関数の違いは「書き方だけ」ではない。異なる性質が10個ほどある。 - Qiita
本稿では、アロー関数とfunctionキーワードを使って定義される関数を区別するため、functionキーワードを使うほうの関数を「通常関数」と呼ぶことにします。英文で見かけるregular functionの翻訳になりますが、これは公式の用語ではなく、解説の便宜上のものとご理解頂ければと思います。単に「関数」というときは、通常関数とアロー関数どちらも指すこととします。 関数の歴史 歴史的に見ると、通常関数は古くからある言語機能であるのに対し、アロー関数は新しいものです。アロー関数はES2015(ES6)で導入されました。導入にあたっては、関数を短く書きたい、thisを束縛したくないという2つの理由があります。 通常関数とアロー関数の性質の違い 通常関数とアロー関数では、構文が違うというのは見て分かると思います。構文についての違いはここでは解説しません。 ここでは、文法以外の相違点をひとつ
バックエンドエンジニアのためのVue.js、React、Angular入門 - Qiita
WEBシステム、WEBプログラム開発において昨今ではjQueryではなくVue.js、React、AngularなどのJSフレームワークが主流となってきています。ただ、これらの活用は学習コストが高いといわれています。その原因はフロントエンドありきで話が進みすぎていたからだと考えています。したがって、自分の投稿記事は、jQueryを多用するWEBシステムエンジニアに向けた、フォーム操作をメインに置いた半備忘録兼自分なりに解釈した解説です。 ちなみに自分はサーバ構築からバックエンドまでこなしているワンオペエンジニア（フリーランス、非正規雇用に非ず）です。 コンポーネント、ルーティング、スタイル周りの続編を作成しました（編集が困難になるほど容量圧迫してたので、それぞれで独立させています）。また、Vueは3.2から採用されたscript setup、Angularは14から採用されたスタンドアロン
早く・それなりの UI を実現する React コンポーネントセット 16 選 - Qiita
これまで、開発者が「早く・それなりの UI 」を実現するために、Bootstrap などの CSS フレームワークが重宝されてきました。 しかし今では、React などのライブラリを使って UI をコンポーネント化するようになってきています。 React であっても、事前に CSS フレームワークを読み込んでおき、クラス名を付与することでこれまでと同じように使うことができます。 ただ、既存の CSS フレームワークは内部で jQuery を使用していることが多いので、React と jQuery を共存させるか、jQuery 部分を自前で実装しないといけません。 そこで React で「早く・それなりの UI 」を作れそうな React コンポーネントセットを手当たり次第に調べてみました。 Note: Web 向け UI の コンポーネントのみとなっています。React Native や
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>
msto.jp - it転職 リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
Eメールの入力間違えを防いでくれるjQueryプラグイン「mailcheck」:phpspot開発日誌
How we decreased sign up confirmation email bounces by 50% - Kicksend Blog Eメールの入力間違えを防いでくれるjQueryプラグイン「mailcheck」。 hotmailがhotnailになっていたり、yahooがyhooになっているのを検出してくれます。 よくありがちな間違いかと思うのでサイトのメール入力欄に入れておくと問題を解消できそう 英語仕様ですが、配列を次のように定義してあげれば対応できそうです。 docomo.ne.jp とか yahoo.co.jp とか自由に入れるだけです 関連エントリ 円形に広がるソーシャルシェアボタン実装jQueryプラグイン「jOrbital」 ページめくりを実現するためのjQueryプラグイン集 faviconをアニメーションさせたりテキストを付与できるjQueryプラグイン
サービス終了のお知らせ - NAVER まとめ
サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。
iOSとAndroidに最適化したJavaScriptフレームワーク「jqMobi」登場。jQuery Mobileより小さくて高速
iOSとAndroidに最適化したJavaScriptフレームワーク「jqMobi」登場。jQuery Mobileより小さくて高速 jQuery Mobileと同様に、HTML5のマークアップでモバイルアプリケーション開発を実現するオープンソースのJavaScriptフレームワーク「jqMobi」のβ版が公開されています。 jqMobiのコンセプトは、jQueryとjQuery Mobileの機能のサブセットを、iOSとAndroid向けに最適化したものといえるでしょう。 すでにjQueryやjQuery Mobile、あるいはSencha Touchなど、さまざまなモバイル向けHTML5/JavaScriptフレームワークが登場する中で、jqMobiの特徴はどこにあるのか、ブログで次のように説明しています。 jQuery - still focuses on the desktop.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
スプレッドシート風のテーブルウィジェット実装JS「Dynamic Table」:phpspot開発日誌
東京渋谷 “HTML5入門＆jQuery” 勉強会(5/26)の資料を公開します | tonowp
