タグ

JavascriptとjQueryに関するmohnoのブックマーク (15)

  • 「JavaScriptで要素をドラッグして移動する簡単な方法」という記事が初耳だらけだった件 - Qiita

    はじめに まず↓の記事を見てない方はぜひ見てください! 自分にとってはこの記事には「えっ、ナニコレ!」なテクニックが多く、特に解説もなかったのでいろいろ調べてたら休日が消えてました... なのでその時間の供養もかねて、自分が知らなかった部分を中心に、僭越ながら元記事の解説を書いてみたいと思います。 ちなみに、以下が元記事のコードそのままを実装したものです。たしかに掲載コードだけで要素がグリグリ動きますね。 See the Pen js-drag-move-original by www-tacos (@www-tacos) on CodePen. 初耳1: $img まずコードのここ <img id="$img" src="https://js.cx/clipart/ball.svg" width="40" height="40"> <script> $img.onpointermove

    「JavaScriptで要素をドラッグして移動する簡単な方法」という記事が初耳だらけだった件 - Qiita
    mohno
    mohno 2024/02/28
    若者のjQuery離れ(←オイ)
  • jQuery 4.0.0 BETA! | Official jQuery Blog

    jQuery 4.0.0 has been in the works for a long time, but it is now ready for a beta release! There’s a lot to cover, and the team is excited to see it released. We’ve got bug fixes, performance improvements, and some breaking changes. We removed support for IE<11 after all! Still, we expect disruption to be minimal. Many of the breaking changes are ones the team has wanted to make for years, but co

    mohno
    mohno 2024/02/07
    「Goodbye IE<11」←「<11」なんだ。そりゃ面倒なだけで使えないわけじゃないけど。"Some may be asking why we didn’t remove support for IE 11."
  • jQueryへの別れ:現代的な開発のための必須JavaScriptメソッド - Qiita

    はじめに 私は長い間レガシーコードと共に仕事をしてきましたが、jQueryの重要性は依然として頻繁に話題に上がるトピックの一つです。ライブラリ自体は便利なままですが、それは別の時代のニーズを完璧に満たしていました。 現在、私たちは既にES2023について話していますが、過去にjQueryがカバーしていたほとんどの機能は、すでに2015年にリリースされたES6に取り込まれています。 ES6の標準は既に広範にサポートされており、96%のレベルに達しています(出典:caniuse.com)。そのため、特に要素の選択、スタイリング、アニメーション、データの取得などの基的なタスクについては、ライブラリの使用を見直す良いタイミングかもしれません。 以下のトピックは、いくつかの標準的なjQueryのパターンと、それに相当するバニラJavaScriptでの手法を示す参考資料として役立つと思います。 要素

    jQueryへの別れ:現代的な開発のための必須JavaScriptメソッド - Qiita
    mohno
    mohno 2023/06/24
    なんだかんだ言って長くはなるんだよな。それが本質でないのは分かってるけどさ。
  • jQuery UIとjQuery Mobileがついに開発終了、今後はメンテナンスのみに。jQuery本体は引き続き積極的に開発

    jQuery UIとjQuery Mobileがついに開発終了、今後はメンテナンスのみに。jQuery体は引き続き積極的に開発 JavaScriptUIフレームワークであるjQuery UIと、モバイルアプリケーション向けフレームワークであるjQuery Mobileは今後新規機能の開発が行われず、jQuery UIについてはメンテナンスへ移行、jQuery MobileについてはDeprecated(利用を推奨せず)になることがOpenJS Foundationから正式に発表されました。 jQuery UIは2007年に登場、jQuery Mobileは2011年に登場しました。一時期はWebサイトなどで広く使われ、関連書籍なども数多く出版された主要なライブラリ群の開発が正式に終わることになります。 ただしjQuery体の開発は引き続き積極的に行われていくとのことです。 Follo

    jQuery UIとjQuery Mobileがついに開発終了、今後はメンテナンスのみに。jQuery本体は引き続き積極的に開発
    mohno
    mohno 2021/10/12
    「jQuery UIについてはメンテナンスへ移行」←いつまで保守されるのかな。「jQuery MobileについてはDepricated(利用を推奨せず)になる」「jQuery Mobile…最新版のjQueryにも対応できていません」←そうなのか(使ったことはない)
  • 一休.comホテルページのスマホ版からjQuery依存を取り除くためにやったこと - 一休.com Developers Blog

    一休.comでWebフロントエンドを開発している宇都宮です。 先日、一休.comホテルページのスマホ版から、jQueryを取り除きました。jQueryを取り除いた経緯、やったこと、結果について書きます。 ちなみに、ホテルページには以下のURLでアクセスできます(スマホで開くか、PCの場合はUAをスマホに偽装する必要があります) https://www.ikyu.com/sd/00001290/ なぜjQueryを取り除いたのか? どうやったのか 何をやったのか jQuery.ajax() => fetch に置き換え fetchのpolyfillを採用した理由 DOM操作を標準APIに置き換え 要素の取得 show/hide addClass/removeClass html/text アニメーション $.ready() イベントフィルタリング jQueryの使用を防ぐ目印 jQuery削

    一休.comホテルページのスマホ版からjQuery依存を取り除くためにやったこと - 一休.com Developers Blog
    mohno
    mohno 2019/01/17
    これは重要な知見で、素晴らしい情報公開。「約4ヶ月かかった計算」「スコアが変わるほどのインパクトはなかった」/現状を知らないけどjQueryって“IE非対応軽量版”みたいなものはないのかな。
  • 新人にドヤ顔で説明できるか、今風フロントエンド開発ハンズオン(git/node.js/ES6/webpack4/babel7) - Qiita

    新人にドヤ顔で説明できるか、今風フロントエンド開発ハンズオン(Git/Node.js/ES6/webpack4/Babel7)JavaScriptNode.jses6webpackbabel 概要 今風の手法でJavaScriptアプリを作ろうとすると色々ツールがあって便利な反面、複雑でわからないことがたくさんあります。 わからないことがあったら、それを放置せず、しっかり理解して大いに寄り道しつつブラウザで動作するJavaScriptアプリをゼロから作っていきます ブラウザ上で動作するフロントエンドアプリを作ったら、ライブラリ化してnpmモジュールとして公開します 対象読者=今風のJavaScript開発の入門者、初心者 11年前からタイムトラベルしてきたひと ブラウザ用アプリを作りたいが今風の手法の初心者(jQueryだけでなんとか生きてきた人とか) Node.jsの環境をつかってフロン

    新人にドヤ顔で説明できるか、今風フロントエンド開発ハンズオン(git/node.js/ES6/webpack4/babel7) - Qiita
    mohno
    mohno 2018/11/13
    もろ“対象読者”だなあ^_^;
  • IE対応と言われたら金額倍くらいを提示したい

    ウェブ系の仕事をしてるが気軽にIE対応とか言われることがあるが気軽に対応できるものではない IEは最新の11ですらもう何年も前のものだ もう5年くらいは経つのだろうか セキュリティのアップデートはあるようだが、機能の更新はない ChromeやFirefoxは1,2ヶ月程度に1回アップデートをしていて毎回様々な機能が追加されている 今ではもうIEとで使える機能の差はとても大きい 未だに昔ながらのjQueryのみという作りをしているのであれば大して気にすることではないがモダンブラウザをターゲットに最新機能をどんどん導入している場合はIE対応がかなり辛い 実際に倍くらいの時間がかかることもある JavaScript コア部分であれば Babel で変換したりpolyfillである程度の対応はできるが DOM などブラウザ固有の WebAPI はそうではない 別途それぞれのpolyfillを集めて

    IE対応と言われたら金額倍くらいを提示したい
    mohno
    mohno 2018/03/08
    わかる。「IEとで使える機能の差はとても大きい」←たいしてモダンな仕事をしてないから(あまり)関係ないけど、それでも他で使えるものが使えないので対応をあきらめたものがあるんだよな。
  • Web Developer Roadmap 2018が出たので2017年版と比較してみる - Qiita

    のようなイメージではないでしょうか? (灰色と橙色の分け方は作者のおすすめ度(匙加減)な気もしなくないんですが) はい…まさにこの通りですのでこれを参照頂ければなと思います。隅まで目を通していないのがバレますね。 では早速題 🚀Introduction これが2017版 2018版 左の奴らが軒並みチョーヤバいです。雑だな! まあここは導入みたいなもんなんで深くは追及しません。最早OSSや仮想鯖、クラウド環境化での開発は必須なんだってことが言いたいんだと思います。(適当) デザインパターンってのはGoF(Gang of Four)というおじさん4人がソフトウェア開発に取り入れたオブジェクト指向プログラミングにおけるこう書くとオブジェクト指向的にええと思う!っていうパターンの集まりです。全23種、知らず知らずのうちに使っているものも多いです。 なんで今追加されたのか僕にはよくわかりません

    Web Developer Roadmap 2018が出たので2017年版と比較してみる - Qiita
    mohno
    mohno 2018/01/16
    こういうの追いかけてるってだけで「偉いなぁ」と思ってしまうロートル^_^;
  • これからは今まで以上に、jQueryが必要なくなるかもしれない

    3, 4年前あたりから、jQuery無しでこう記述するとか、jQueryの一部の機能を代替する軽量スクリプトなどが出始めました。 2017年も半年が過ぎ、その状況はさらに変わり始めています。 (Now More Than Ever) You Might Not Need jQuery 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 現在のブラウザ事情 jQueryに替わる、JavaScriptの選択肢 マイクロライブラリの台頭 IE9への対応はポリフィルで NodeListの反復 jQueryは遅いのか? jQueryについて私が嫌いなもの $なしでは生きていけない? 現在のブラウザ事情 jQueryが2006年にリリースされてから、DOMとブラウザのAPIは飛躍的に向上しています。2013年に「You Might Not Ne

    これからは今まで以上に、jQueryが必要なくなるかもしれない
    mohno
    mohno 2017/07/14
    あ、“これからは”って話なのかw
  • フロントエンドが嫌い

    ウェブフロントエンド技術の進歩と興亡の速度には目を見張るものがある。 browserifyが生まれ、Gruntが生まれ、Gulpが生まれた。 そしてその全てが死んだ。 Webpack, Babel, Flow, 今栄えている技術だってそのうちに死ぬだろう。Reactだって例外ではない。 一部はもう死につつあるし、少し前にあれだけ持て囃されたTypeScriptも今や消えつつある。Coffeeは全エンジニアから嫌われた。 そんな万華鏡のように目まぐるしく変わる情勢に追い付かんと研鑽を続ける者等がいる。アーリーアダプターを自称し最新技術のケツを追いかけQiitaにクソを垂れ流す彼らこそ我らがイケイケウェブフロントエンジニアである。 最新技術に目を凝らし、やれ新たなこれイケてるだの古臭いあれはイケてないだのと宣いチュートリアル記事を量産する彼らであるが、彼らの存在は決して無駄ではなく、生まれた

    フロントエンドが嫌い
    mohno
    mohno 2017/05/06
    TypeScript死んだっけ?という話はあるけど、付いていくのは大変だよねぇ。まあ、いまだに Flash 使ってるところはあるんだよな。Windows フォームも健在みたいだし。
  • jQueryの「$」やセレクタなどをサポート、jQueryの代替として利用できる超軽量スクリプト -Selector

    jQueryは確かに便利ですが、すべての機能が必要かと言われれば、そうではない人が多いと思います。 「$」やセレクタなど、jQueryの機能をサポートしたjQueryの代替として利用できる超軽量スクリプトを紹介します。 Selector -GitHub 最新のjQueryのファイルサイズは、下記の通り。 jquery-3.2.1.js 270 KB jquery-3.2.1.min.js 90 KB そして、Selectorのファイルサイズは、1/4以下! selector.js 65 KB selector.min.js 17 KB もちろん、jQueryの機能すべてが利用できるのではなく、オブジェクトやセレクタや関数に限られています。 サポートされているjQueryの機能 サポートされているjQueryオブジェクト $ サポートされているjQueryセレクタ add addClass

    jQueryの「$」やセレクタなどをサポート、jQueryの代替として利用できる超軽量スクリプト -Selector
    mohno
    mohno 2017/04/19
    こういうのはなあ、と思いつつ、最適化で削除されたりせず読み込まれるものだからなあ。
  • IE11のバグまとめ - Qiita

    バージョンごとに進化するIEのバグ 備忘録も兼ねて記事にまとめました。 バグについての解決策と補足も併せて記載してますが、 記事に記載されていない遭遇率高めのバグやより良い解決策などがあれば、是非フィードバックをお願いします。 まとめてみた所感としては、IE6の頃から根的な部分は変わってない気がします。 (ただし、パフォーマンスが大幅にアップしたのは認める。) IE11はWindows10の場合、2025年までサポートが続きます。 https://support.microsoft.com/ja-jp/lifecycle/search/18165 ナンテ/(^o^)\\(^o^)//(^o^)\\(^o^)//(^o^)\コッタイ もうね...アボカドまるごとバナナかと。 ちなみに今年の4月でVistaがサポート終了するので、1ヶ月後にはIE9を窓から放り投げてOKです。 https:/

    IE11のバグまとめ - Qiita
  • jQueryの後に学びたい最新JSフレームワークまとめ

    jQueryを「卒業」して次へ進みたいWeb制作者のために、Vue.js、Chart.js、D3.js、Reactなどの最新フレームワークについての記事を「WPJ」の記事の中から紹介します。 1.シンプルで触りやすい、Vue.jsから始めるアプリ開発 『jQueryはもうしんどい…フレームワーク初心者ならVue.jsから始めてみたら?』(WPJ) jQueryは超便利。でも、ちょっとアプリっぽいものを作るには見通しも悪いし、後々のメンテナンスも大変…。Angunlar.jsやReact.jsよりもシンプルで触りやすい、Vue.jsから始めてみてはいかが? 2.シンプルグラフならChat.jsにおまかせ 『カッコいいグラフがむちゃくちゃ簡単に描ける!Chart.js 2.0がスゴい』(WPJ) データビジュアライゼーション系のライブラリーといえば、D3.jsが有名。でも、シンプルなグラフをW

    jQueryの後に学びたい最新JSフレームワークまとめ
  • jQuery:チェックされたら or 入力されたら送信可能にするボタンを実装する方法 - NxWorld

    割と頻繁に使うので備忘録。 jQueryを使用して「チェックボックスにチェックされたら送信可能にするボタン」と「文字が入力されたら送信可能にするボタン」をそれぞれ実装する方法です。 特にチェックボックスの方は利用規約などに同意してもらったかの部分で用いたりと使う場面が多いのではないかと思います。 チェックボックスにチェックされたら送信可能にするボタン ページが表示された際はイメージ左のようにボタンにはdisabledが指定されて送信できない状態になっています。 それを「利用規約に同意します」というテキスト横にあるチェックボックスにチェックが入ったら、ボタンに指定してあるdisabledを解除して送信可能にするというものです。 実装にはjQueryを使用するので予め読み込ませおき、それぞれ下記のように記述をします。 <input type="checkbox" id="check" /><l

    jQuery:チェックされたら or 入力されたら送信可能にするボタンを実装する方法 - NxWorld
    mohno
    mohno 2014/02/27
    なんかスマートな方法があるのか……と思ったら、普通の条件文だった。
  • 人気上昇中のJavaScriptライブラリを調べてみた[ジャンル別に比較]

    連載 INDEX 次回 → こちらのページで【2015年版】も発表! ■ 2014年が始まり、心機一転で「今年こそはWeb開発を頑張ろう」と思っている人も少なくないだろう。そんな方々に向けて稿では、2013年中に人気が急上昇してきており、「2014年では必須の知識」となりそうなJavaScriptライブラリ(Library)をランキング形式で発表する。 なお、稿のランキング決定では、検索キーワードの流行を調査可能な「Googleトレンド」(「すべての国」「過去 12 か月間」「すべてのカテゴリ」「ウェブ検索」という条件で絞り込み)を使って、ライブラリの人気をジャンルごとに比較した(※ライブラリ名が一般的な英単語の場合、Web検索時に、その英単語にもヒットしてしまう。このノイズがGoogleトレンドでの結果として入り込んでいる可能性が高いことをご了承いただきたい。各ジャンルは、筆者が独自

  • 1