Hatena::Groupstudyroom

phaのPHPとか自習室 このページをアンテナに追加 RSSフィード

PHP(CakePHPとか)、JavaScript(AJAXとか)、MySQL、UNIX、Fireworksなんかを身につけたい><
2007 | 03 | 04 | 05 | 06 | 08 | 09 | 10 | 11 | 12 |
2008 | 01 | 02 | 03 | 04 | 05 | 06 | 07 | 08 | 09 | 10 | 12 |
2009 | 01 | 02 | 03 | 04 |
2010 | 01 | 06 |
2011 | 01 |

2011-01-24

サイトの文章を変換するJavaScript

| サイトの文章を変換するJavaScript - phaのPHPとか自習室 を含むブックマーク はてなブックマーク - サイトの文章を変換するJavaScript - phaのPHPとか自習室 サイトの文章を変換するJavaScript - phaのPHPとか自習室 のブックマークコメント

function henkanw){
   // BODY要素のデータを取得
   var htmlData = document.body.innerHTML;
   htmlData = htmlData.replace(/。/g,'死〜');
      
  //BODY要素を上書き挿入
   document.body.innerHTML = htmlData;
      
}

2008-10-15

DOMとかXPathとか

| DOMとかXPathとか - phaのPHPとか自習室 を含むブックマーク はてなブックマーク - DOMとかXPathとか - phaのPHPとか自習室 DOMとかXPathとか - phaのPHPとか自習室 のブックマークコメント

Document Object Model - Wikipedia

Document Object Model(DOM)は、W3Cから勧告されている HTML文書やXML文書をアプリケーションから利用するためのAPIである。 Level 1~Level 3まで勧告されている。

XMLを読み込む別のAPIであるSAXと異なり、XMLデータツリー構造して扱う事ができる。ただし、通常の場合対象XML文書を全て読み込んでからの扱いを前提とするため動作速度が遅かったり、メモリーの使用量が大きくなったりする欠点もある。

W3CではAPI仕様定義しているのみで、特定のプログラム言語対象としたものではない。 DOMの実装は各メーカーに委ねられており、DOMを実装したXMLパーサーが各メーカーから提供されている。

DOMブラウザが実装している。

Latest > Flakes of Ideas > JavaScriptでDOMを使う――オブジェクト指向入門の入門 - outsider reflex

一般的な用語としてDOMとは、ここまでの例で「画像」を「幅・高さ・URLなどのプロパティを持ったオブジェクト」として扱ってきたように、Webページのリンクやフォームといった要素を「リンク先・子要素の一覧・内容のテキストなどのプロパティを持ったオブジェクト」として扱うための取り決めです。

頑張れば自分でクラス定義して独自のDOMを構築することも可能ですが、幸いにも、世の中には既にWeb標準DOMW3C DOM)というものが存在しています。W3C DOM仕様通りに実装している処理系では、仕様定義されているプロパティやメソッドを他の定義済みクラスユーザー定義クラスと同じように利用することができます。

JavaScriptにも手続き型で書く手法とオブジェクト指向で書く手法があるが、DOMを使うってオブジェクト指向のやり方を覚えよう。

XPath

XML Path Language - Wikipedia

XML Path Language (XPath; XMLパス言語) は、マークアップ言語 XML に準拠した文書の特定の部分を指定する言語構文である。 XPath自体は簡潔な構文 (式言語) であり、XMLに準拠したマークアップ言語ではない。

XPathとは 【Xパス】 - 意味・解説 : IT用語辞典

 XML文書の中の特定の要素を指し示す記述方法を定めた規格。W3Cが勧告した標準仕様で、XSLTやXPointerで使われる位置指定の記述方式を独立させたもの。

 ハイパーリンクなどに使われる人為的に付加されたアンカーによる指定とは異なり、XMLデータを表す木構造をたどって文書内のあらゆる要素や属性アクセスする手段を提供する。

「指し示す記述方法を定めた企画」に過ぎないのか。

DOMXPath

ちょっと自分の中でごっちゃになってる。

PHPでMSXML3を使う

 XMLDOMオブジェクトDOMツリー内のノードを操作する為にはそのノードXPathで指定する必要があります。

 簡単にいうとUNIXでのディレクトリ表現と同じようなものです。

 ここではリスト1のsensyu.xmlをもとにXPathの説明をしてまいります。

構造の規格と、その構造の中のパスの書き方の規格、ということなのか。

XPathを使った要素の取得[XML DOM関数] - bnote

XPathとは、XML文書の中の特定の要素を指し示す記述方法で、基本的な記述UNIXファイル

システムに似ています(ロケーションパス)。文書木構造の頂点となるルートノードを「/」で

あらわし、以下、「/」で区切って要素をたどっていきます。

このロケーションパスは、XPathの主要な部分ですがもっと奥が深いです。

パスを指定して要素を取得

XPathで要素を指定して要素オブジェクトを取得するには、xpath_new_context()とxpath_eval()を

使用します。

PHPではSimpleXML関数

PHPならSimpleXML関数を使ってればDOMとかXPathとか要らないのかな、と思ったら、SimpleXML関数を使うときにXPathを使ったりするんだな。

SimpleXML関数

SimpleXMLには、Xpathサポートしています。 <character> 要素を全て見つけるには、 以下のようにします。

<?php
include 'example.php';
$xml = simplexml_load_string($xmlstr);

foreach ($xml->xpath('//character') as $character) {
    echo $character->name, 'played by ', $character->actor, '<br />';
}
?>

'//' はワイルドカードして動作します。絶対パスを指定するには、 スラッシュを一つだけにします。

この機能は知らなかった。

XPathって超簡単だよ><

JavaScript-XPath をリリースしました!さあ、あなたも XPath を使おう!(解説付き) - IT戦記


だいたいなんとなくわかったかな。

2008-10-13

画像ぶっこぬき

| 画像ぶっこぬき - phaのPHPとか自習室 を含むブックマーク はてなブックマーク - 画像ぶっこぬき - phaのPHPとか自習室 画像ぶっこぬき - phaのPHPとか自習室 のブックマークコメント

参考にする

javascript:(
 function(){
  f=function(p){
   imgs=new Array();
   while(c=p.firstChild){
    o=p.removeChild(c);
    imgs=imgs.concat(f(o));
    if(o.tagName=='IMG'){
     imgs.push(o)
    }
   }
  return imgs
  };
  imgs=f(document.body);
  for(i in imgs){
   document.body.appendChild(imgs[i])
  }
 }()
) 

http://mixi.jp/view_bbs.pl?id=35933125&comm_id=3721483

2008-10-11

youpy

| youpy - phaのPHPとか自習室 を含むブックマーク はてなブックマーク - youpy - phaのPHPとか自習室 youpy - phaのPHPとか自習室 のブックマークコメント

youpy – Userscripts.org

すごいなー

これって

<script>
setInterval(function() {
  var effects = 'Shake Pulsate'.split(/\s+/);
  document._getElementsByXPath('//*').each(function(e) {
    Effect[effects[Math.floor(Math.random() * effects.length)]](e);
  });
}, 2000);

</script>

これだけでできるのかな。まだ記述意味がよくわかってないけど。

関数リテラル

| 関数リテラル - phaのPHPとか自習室 を含むブックマーク はてなブックマーク - 関数リテラル - phaのPHPとか自習室 関数リテラル - phaのPHPとか自習室 のブックマークコメント

関数リテラル

匿名関数

ラム関数

function square(x){return x*x;}

var square = function(x){return x*x;}

と書ける。

何の意味があるのかまだわからない。。。

2008-04-27

JSのフレームワーク?とかライブラリ?

| JSのフレームワーク?とかライブラリ? - phaのPHPとか自習室 を含むブックマーク はてなブックマーク - JSのフレームワーク?とかライブラリ? - phaのPHPとか自習室 JSのフレームワーク?とかライブラリ? - phaのPHPとか自習室 のブックマークコメント

総合まとめ

jQuery

jQuery は様々な処理を短く簡単に書ける JavaScript ライブラリです. 独自のXPATH/CSSセレクタを利用することで,多くのDOM操作を非常に簡単に書くことが出来ます.

ニュータイプなJSライブラリjQueryを使ってみよう!

[理解]


prototype.js


[理解]



[資料]

prototype.js リファレンス

prototype.js逆引きサンプル集 - JavaScriptist

scriptaculous

script.aculo.us - web 2.0 javascript

scriptaculous逆引きサンプル集 - JavaScriptist

Ajaxの弱点を補うscript.aculo.usの楽しいエフェクト(1/4) ─ @IT

prototype.jsベースライブラリ使用しているので、prototype.jsとともに利用したことがある方も多いのではないでしょうか。

Ajaxの弱点を補う「エフェクト」の必要性

script.aculo.usを読み解く:第1回 scriptaculous.js|gihyo.jp … 技術評論社

script.aculo.usというと,Web2.0デザインを簡単に実現できるライブラリとして,派手なエフェクトにばかり注目が集まりますが,Ajaxを使った入力補完やドラッグアンドドロップなど,ユーザビリティの向上に大きな威力を発揮する点も見逃せません。

prototype.jsに大きく依存しているのも特徴のひとつです。

2008-03-29

関数

| 関数 - phaのPHPとか自習室 を含むブックマーク はてなブックマーク - 関数 - phaのPHPとか自習室 関数 - phaのPHPとか自習室 のブックマークコメント

第2回 JavaScriptの関数をマスターしよう - @IT

この挙動は、JavaScriptにおける関数の重要な性質を示している。結論から述べるならば、(冒頭でも述べたとおり)JavaScriptにおける関数とはオブジェクトであり、関数を定義するのは「<関数名>という名前(ここではadd)の変数に関数オブジェクトを格納している」のと同意であるということだ。

2008-03-14

prototype.jsとか何

| prototype.jsとか何 - phaのPHPとか自習室 を含むブックマーク はてなブックマーク - prototype.jsとか何 - phaのPHPとか自習室 prototype.jsとか何 - phaのPHPとか自習室 のブックマークコメント

とかjQueryとかよく名前聞くけど。フレームワークとかいうけどいったい何をするものなのか想像できない。

めんどいので今日は寝る。