ASCII.jp：最新のPC／スマホ／デジタルガジェットのレビュー＆ニュース情報が満載！難しいことを分かりやすく、最新の情報を楽しくお届けする、総合IT情報サイト。
【脱jQuery】JavaScriptをネイティブで書くときのあれこれTips | Will Style Inc.｜神戸にあるウェブ制作会社
こんにちは、デザイナーの奥田です。 最近では「脱jQuery」や「Vanilla.js」という言葉が流行っていますがjQueryをはじめに覚えた僕としてはなかなかハードルが高いイメージでした。 jQueryを切り捨てるメリットとしては「ファイルサイズ」や「表示速度」があると思います。そこまで大きな差は感じないかもしれませんが少しでもクオリティを上げるためであれば切り替えてみてもいいかもしれません。 今回は脱jQueryする際によく使う書き方をjQueryとNativeを見比べながら解説していきたいと思います。 Table of contents要素の取得イベントの操作クラスの操作属性の操作スタイルの操作ループ処理Vanilla.jsのプラグイン最後に要素の取得IDはDocument内に1つというルールがあるので取得はgetElementByIdで取得するのが手っ取り早いでしょう。 ID//
範囲外クリックでポップアップを閉じる正しい JQuery - Qiita
ポップアップを表示して、その領域外をクリックされた時にそのポップアップを閉じたい、といった処理はよくあります。しかしこれを実装する時にちょっとした気をつける点があります。 よく見かけて気になっている悪い例 Stackoverflow などでよくある処理としては、クリックイベントを全検知して、Pop up を閉じるような処理をしてしまう。もし自分自身だったら stopPropagation()1 して、イベント伝播しなくする。理由としては stopPropagation() しないと、ポップアップそのものをクリックした時に閉じてしまうのを防ぎたいからです。 例えばこういったコードです。
脱jQuery .attr() | q-Az
属性値を取得したり変更したり出来る .attr() のネイティブ書き換えです。これまでにも何度か書き換えの記事で既に登場してるので再登場となります。 詳しくは 脱jQuery その1 を御覧ください。 .attr()（属性を取得） $("#myimage").attr("src")書き換え JavaScriptdocument.getElementById("myimage").getAttribute("src")attribute の省略版が attr ということになります。使い方は単純で getAttribute() のカッコ内に取得したい属性値を入れることで取得できます。 JavaScript の属性取得には別の方法を使える属性もあり、そちらのほうがメジャーなのですが、その方法は取得できない属性もあります。全て属性値を万能に取得できる方法は上記の方法となります。 他の方法も知りたい
jQueryでチェックボックスのチェック状態を調べる方法 - 小さい頃はエラ呼吸
photo credit: Alan Cleaver via photopin cc 2013.06.14追記 コメント欄の指摘を受けて、記事を一部修正しました。 はじめに jQueryでチェックボックスのチェック状態を調べる方法をまとめてみました。 Web制作の現場で使うjQueryデザイン入門[改訂新版] (WEB PROFESSIONAL)posted with amazlet at 14.02.01西畑一馬 アスキー・メディアワークス 売り上げランキング: 6,298 Amazon.co.jpで詳細を見る jQueryのバージョン jQuery v1.10.1 jQueryでチェックボックスのチェック状態を調べる方法１ jQueryでチェックボックスのチェック状態を調べるには、以下のようなコードを書きます。#check1はチェックボックス要素のIDを指定します。$("#check1
ブラウザの戻るボタンで戻った時、画面の状態も残っている│JavaScript│グラビカ学習帳～ホームページ制作会社 gravity works（グラビティ・ワークス）の備忘録と知識の共有と蓄積
あるページAからfancyBoxのようなモーダルウィンドウを開いたままページBに移動した後、 ブラウザの戻るボタンでページAに戻ったところ、モーダルウィンドウが開いたままになっていました。 SafariとFirefoxで起こるようです。 下記のサイトで詳しくまとめられていました。 SafariとFirefoxでブラウザバック（戻るボタン）を押した際、前のページの画面効果残っている件ついてを解説 JS等のスクリプトの実行状況をキャッシュしてしまうそうです。 <header>内に下記の記述をすることで解決できます。 ■通常の記述 <script type="text/javascript"> window.onunload = function(){}; </script> ■jQueryを利用した場合 <script type="text/javascript"> $(window).bin
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript でテキストエリア内のカーソルのある位置に文字列を挿入する方法 - Qiita
JavaScript, jQuery でのURLの扱い方 - Qiita