メシのタネ

Webプログラミング 備忘録

  • AWS移行でコケ中

    現在このWebサイトが稼働している、このサーバーのMySQLをマスターとし、AWS上のRDSをスレーブとして、データ移行をしようと思ったが、バイナリロギングの取得が上手くいかない。多分の手順VPSのDBでスレーブ用のユーザ作成バイナリロギングを行うスレーブ側RDSにマスターのDUM[...]

    続きを読む
  • AWS ソリューションアーキテクト アソシエイトに合格しました。

    実は、今日までIT無資格でした。ええ歳だし、そろそろなんか資格取っておくかーと考えだしたので、取って嬉しい資格を取ろうと思ってたところ、AWSの資格あったなーと思って、調べてみたら、みんな14日で受かる!とか言ってるので、じゃあというこで、試験日14日後とかにして、試験の予約入れたのが地獄の始まり[...]

    続きを読む
  • DOMをPHPで操作できたらいいよね

    そうだよね。そう思うよね。JavaScriptでやると、画面がガタついたりするもんね。そうならないようにする方法もあるかもしれないけど、僕はできませんので、サーバー側でなんとかできたらええなぁと思って挑戦したけど、できませんでしたよ。PHP標準でHTMLをDOMにできるらしい今、技[...]

    続きを読む
  • 設計書ってなんで書くの?

    設計書をなぜ書くのかから始めてかれこれ3年近くこの禅問答をやっているわけですが、いまだに答えは出ません。ただ、その禅問答をやる中で設計書に対する取り組み方は大きく変わったので、その一部でも書いていきたい。基本設計はとにもかくにも必要だと思う設計書はいらぬ!という話をよく聞くし、自分[...]

    続きを読む
  • 書ききってやる。

    久々に書いてみる。久々に文章を書くということをやってみようと思う。伝える作業を観察したいと思ったからそうしたいと考えた。情緒的な文章は基本的にゴミ箱にぽいしてきましたが、情緒的なのも自分だと思う。「文章をかくという作業は、とりもなおさず自分と自分をとりまく事物との距離を確認すること[...]

    続きを読む

OREILLY Javascript 15章-2 ドキュメントの選択

ネタが無いのでエヴァーノートに取ったノートでも乗っけてみます。

何も実現したいプログラムが思いつかない日は本読んでエヴァーノートしてます。
今日はその中から、DOMの扱い方を説明したオライリーのサイの奴から読んでまとめたノートから

記事の内容をかきます。

ドキュメント要素の選択

クライアントサイドでJavascriptはドキュメント要素を操作している
プログラムが開始するときに、Documentオブジェクトの参照が可能
Document要素を操作する為には、Element要素を取得しなければならない

Element要素を取得する方法

5つの方法がある

  • 1. idを指定
  • 2. name属性を指定
  • 3. 要素名を指定
  • 4. classを指定
  • 5. セレクタを指定
  • IDを取得する方法

    var hoge = document.getElementById(“hoge”);

    name属性を取得する方法

    name属性は一意とは限らないので、getelementsになる。
    var hoge = document.getElementsByName(“hoge”);


    返る値はNodeListオブジェクトで返る。

    但しIEはname属性だけではなく、一緒についてるIDも返してくるので注意が必要

    要素名を取得する方法

    Jsでは要素を型という解釈をする(これはオライリーが擬似的に言ってるだけかも)

    取り出し方はこれも一意ではないので

    var hoge = document.getElementsByTagName(“p”);
    返り値はNodeListオブジェクト

    NodeListの中の要素は参照された順に格納される。


    なので最初のPがほしいなら

    var hoge = document.getElementsByTagName(“p”)[0];
    と書く



    対象のHTMLファイルの要素が全部取得したいのなら

    “*”を引数に指定して

    var hoge = document.getElementsByTagName(“*”);
    これで取得できる



    image、form,aには専用のプロパティがある

    例えばformの場合こうやって式が書ける

    document.forms.id;

関連記事

コメントをお待ちしております