メシのタネ

Webプログラミング 備忘録

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

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

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

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

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

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

    続きを読む
  • 普通の会社で2年普通に働いて思う事

    えらい寒くなりました。文句言いながらも現職を続けて2017年12月1日にめでたく2年がたちました。分かりやすいが乱暴に言えばITドカタと呼ばれる業界に入って案件のヒエラルキーの無慈悲さを痛感しながらも、それでもしょうがないと頑張る人たちに心を打たれながら「じゃあ俺も」と頑張れない自分に挫折して、とあ[...]

    続きを読む
  • jQueryUiのDatepicker利用時にminDate設定するとバグる件

    題名の通りなんですが、DatepickerでminDate使うとバグります。また後でキャプチャ見て貰いますけど、灰色の部分が、minDateで設定した日付が反復して出るようになるんですね。こういうの気が付かない人がいるかも知れませんが、ChoromeでminDate設定してる人は気にしてみてくだ[...]

    続きを読む

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;

関連記事

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