タグ

関連タグで絞り込む (1)

タグの絞り込みを解除

jqueryとjavascriptに関するtk18のブックマーク (12)

  • jQueryのhtml()で追加・取得・書き換えの方法まとめ! | 侍エンジニアブログ

    こんにちは、ライターのマサトです! 今回は、jQueryでHTML要素を取得したり追加・書き換えを行える「html()」メソッドについて学習をしていきましょう! この記事では、 「html()」とは? 文字を出力する HTML要素を取得する HTML要素を書き換える HTML要素を追加する 関数による書き換えについて 「html()」と類似メソッドの違い 「html()」とは? それでは、まず最初に「html()」メソッドの基的な知識から学習を進めていきましょう! 「html()」を使うと、任意のHTML要素を取得したり意図的に要素を追加・書き換えをすることが出来ます。 例えば、次のようなp要素が1つあるとします。 <p>こんにちは!</p> 「html()」を使えば、このp要素にあるテキスト文字を取得したりp要素をa要素に変えてしまうことも可能です! また、1つだけのp要素を3つに増や

    jQueryのhtml()で追加・取得・書き換えの方法まとめ! | 侍エンジニアブログ
    tk18
    tk18 2018/06/24
    .html()
  • 【jQuery】外部ファイルの読み込みと操作 - MAXIMUM.PROの日記

    今回は、外部ファイルの読み込みと操作、GETメソッドを使ったファイルの扱い方を中心に紹介していきます。APIを使ったWebアプリケーションをつくる際に必要になってくるJSON形式について覚えましょう!! 以下のファイルを用意してください。 sample.html <h2>load</h2> <p>外部ファイルのテキストデータをそのままタグに置き換える</p> <!-- javascript:void(0):リンク表示、アクションは起こさない --> <div><a id="load" href="javascript:void(0)">読み込み</a></div> <div id="txtLoad">データ</div> <br /> <p>外部ファイルのHTMLデータをそのままタグに置き換える</p> <a id="load2" href="javascript:void(0)">読み込み

    【jQuery】外部ファイルの読み込みと操作 - MAXIMUM.PROの日記
  • 【jQuery入門】find()で子要素を取得する手法まとめ! | 侍エンジニアブログ

    こんにちは、ライターのマサトです! 今回は、jQueryで深い階層下にある子要素を効率よく取得できる「find()」メソッドについて学習しましょう! この記事では、 「find()」とは? find()の使い方 each()による複数要素の取得 戻り値「length」とは? find()の検索技 「find()」と「children()」の違いとは? などの基的な内容から、応用的な使い方に関しても解説していきます。この記事で、「find()」メソッドをしっかり学習して自分のスキルアップを目指しましょう! 「find()」とは? それでは、まず最初に「find()」メソッドについて基的な知識を学習していきましょう! 「find()」は、対象となる要素から下にある階層をすべて辿って目的の「子要素」を取得することができるメソッドです。この子要素は「子孫要素」とも呼ばれたりしますが、分かりやす

    【jQuery入門】find()で子要素を取得する手法まとめ! | 侍エンジニアブログ
    tk18
    tk18 2018/06/12
  • jQueryを使ったJavaScriptファイルの動的読み込み - JavaScriptテックラボ - [SMART]

    JavaScriptを動的に読み込みたいケースなどがありますが、jQueryのgetScript()メソッドで簡単に実現できます。 $.getScript("./script.js"); これで外部JSファイルを動的に読み込めます。IF文などを使って、スマートフォンのときだけ特定スクリプトを読み込む、などに便利です。 読み込んだ後に処理を行いたい場合は、getScriptの第2引数にコールバック関数を設定できます。 $.getScript("./script.js", function(){ ... });

    jQueryを使ったJavaScriptファイルの動的読み込み - JavaScriptテックラボ - [SMART]
    tk18
    tk18 2018/05/20
    “$.getScript("./script.js");”
  • jQuery.ajax()のまとめ

    jQuery.ajax()について逆引きリファレンスっぽくまとめてみました。 まとめた理由は、ネットで「jQuery.ajax」や「jQuery.ajax サンプル」などで調べても、いい感じの内容がなかなかヒットしないことと、よくヒットするサイトの情報が古かったりする(1.4で止まっているとか)ためです。 ということで、2012年10月現在2014年10月現在の「jQuery.ajax()」などをざっと調べて作ってみました。 初心者向けの内容です。すべてのオプションは網羅できていません。とりあえずサンプルコードがほしい方は15項をご覧ください。 若番から必要と思われるものを順番に並べているつもりですが、後半は適当です。また、各項のサンプルはなんとなく積み上げていく感じにしています。 調べている間にも3つくらい新しい発見(といっても古い情報ですが…)があり、jQueryが日々進化していること

  • プラグインを使わずに、かんたん実装できるjQueryマウスオーバーアニメーションのまとめ | ニトなび

    ここのところ少しブログをリニューアルしたのですが、過去に導入してほとんど活躍していないjQueryマウスオーバーアニメーションを外しました。しかし、なんかせっかく実装したものを外しただけでは無意味なので、今後再導入するときの為に、スクリプトを書きとめておく事にしました。 マウスオーバーアニメーションの種類 オンマウスで画像を切り替えるアニメーション フェイドさせながらテキスト色を変化させるアニメーション フェイドさせながら背景色を変化させるアニメーション テキスト(画像)を横にピコッとずらすアニメーション 画像をボワ~と大きく変化させるアニメーション 画像を右から左へスライドさせ入れ替えるアニメーション 画像をクルッと縦に回転させるアニメーション ※jQuery導入方法の基は過去にこちらの記事に書きましたのでご参考下さい。 オンマウスで画像を切り替えるアニメーション DEMO ⇓ 1.

  • jQuery ウィンドウ全画面や特定要素サイズに合わせて背景画像を設置する素晴らしいプラグイン【BACKSTRETCH】 | Stronghold Archive

    どうもこんばんは。Toshikuraです。今回のTipsは【jQuery ウィンドウ全画面や特定要素サイズに合わせて背景画像を設置する素晴らしいプラグイン【BACKSTRETCH】】です。フルスクリーン(背景全画面)に画像を配置するプラグインは数々ございますが多機能で設定が面倒だったり、若干動きが不安定だったり、重かったりと選択に悩みます…。単純に特定要素の背景全画面に画像を配置するだけのプラグインでしたらこの【BACKSTRETCH】が軽量かつ簡易と一番のオススメです。 BACKSTRETCH ダウンロードページ ウィンドウ全画面への実装 実装方法は至ってシンプルです。まずはウィンドウの背景全画面に画像を配置します。 読み込み <script src="js/jquery-1.X.X.min.js"></script> <script src="js/jquery.backstretch

  • jquery.xdomainajax.jsの文字化け対策版 - Ino Diary

    jquery.xdomainajax.jsの文字化け対策版を作りました。 家からforkして改造したものはこちらです。 https://github.com/inohiroki/jQuery-Plugins/tree/master/cross-domain-ajax jQuery.ajaxのオプションに「charset」を追加してあります。 例えば、shift jisのページを取得したい場合はこんな感じで指定します。 $.ajax({ charset: “Shift_JIS”, url: …

  • 別ドメインの外部URLからidやclassなど特定の箇所を抜き出しサイトに表示する方法

    同じドメイン内であればjqueryのloadやajaxでいけますが、他サイト(別ドメイン)になるとできません。 そこでjqueryのjquery.xdomainajax.jsを使って外部URLのhtmlを取得する方法のTIPSです。 ファイル全部を読むこともできるし、idやclass名で一部分や特定の箇所だけ切り取って表示することも可能。 ※一部のhttpsサイトでは取得できませんでした。(原因不明) jquery.xdomainajax.jsをダウンロード 以下よりjquery.xdomainajax.jsをダウンロードします。 jquery.fn/cross-domain-ajax at master ? padolsey/jquery.fn ? GitHub ダウンロードするのはjquery.xdomainajax.jsだけでOKです。 このファイルがないと別ドメインでのファイルを取

    別ドメインの外部URLからidやclassなど特定の箇所を抜き出しサイトに表示する方法
  • iframeの高さを自動調整するjQueryプラグイン jquery-iframe-auto-height

    iframe(インラインフレーム)は、外部のURL(HTMLファイル、PHP)や他のドキュメントを、画面中にインラインで表示することができる便利なタグです。 しかし、読み込ませる内容によっては、iframeの中でページ移動をした際に、スクロールバーが出てしまったり、最初に設定したiframeの高さに満たないコンテンツが表示された場合、画面の下の方に空白ができてしまい、機能性はともかく見た目の美しさが損なわれます。 そこで登場するのが今回ご紹介するjQueryのプラグイン、「jquery-iframe-auto-height」です。iframeに読み込まれるコンテンツの高さを自動取得して、iframeの高さを変更してくれるというものです。 このプラグインの優れているところは、iframeのタグを既述するHTMLにだけ、このプラグインを読み込ませればOKという手軽さです。読み込ませる先の階層の

    iframeの高さを自動調整するjQueryプラグイン jquery-iframe-auto-height
  • How to Factory Reset iPhone 15 Pro Max - Skyward Design

    Ever find yourself needing to wipe your iPhone 15 Pro Max clean? Maybe you’re planning to sell it, following an iPhone guide at i5apps.com, or perhaps it’s just time for a fresh start. Whatever your reason, performing a factory reset is a straightforward process. By the end of this quick overview, you’ll know exactly how to restore your iPhone 15 Pro Max to its original factory settings. After you

  • Miyakawaブログ » iframe の高さを自動調整する方法

    最近、WordPress サイトカスタマイズが続いたのでその備忘録の続きです。 後、数回続く予定です。 でも、今回は特に WordPress というわけではありません。 WordPress 上のあるページで、iframe を使ってページを表示することになりました。 普通に iframe を使うと Internet Explorer 系では「フレームの高さ」を自動で拾ってくれませんでした。 Chrome も Safari も Firefox も 「height=”100%”」でいけるのに・・・・ 当たり前と言えば当たり前でしょうが、普段コード書かない人なのでちょっとがんばって調べてみました。 結果から言えばやり方を見つけて、実現できました。 jQuery を使って次のように行います。 iframe の高さ(height)を自動で設定する簡単な方法 まず次のサイトにアクセスして必要なファ

  • 1