2012年6月29日金曜日

wordpress アクションフック

An Introduction to WordPress Action Hooks
function.phpに追加する。 

add_action('wp_head', 'insert_some_css');
//以下、関数のコードを追加
第一引数にアクション名、第二引数にアクションフック名を記述する。
投稿者 時刻: 0 件のコメント:
ラベル:

2012年6月15日金曜日

要素の情報を表示する

firefoxのwebdeveloperには同じような機能（しかも高機能）がすでにありますが、似たようなものを作ってみました。 

var mouseBox = function(element){

 var elem = document.getElementsByTagName(element);
 for(var i=0; i < elem.length; i++)
 {
　　　　　　//すべての要素にイベントを設置
  elem[i].addEventListener('mouseover',function(e){//
  
　　　　　　//わかりやすいよう枠でかこむ 
  this.style.border = '1px solid';
  this.style.borderColor = 'red';
  
　　　　　　//新しくdivを作成し表示場所をつくる。
  var child = document.createElement('div');
  child.id = 'child';
  child.style.border = '1px solid';
  child.style.background = '#FFE4B5';
  
               //css情報の取得  
  var rule = getMatchedCSSRules(this,'');
  var style = rule[rule.length - 1].cssText;
  
　　　　　　//取得した情報を表示
  var text = document.createTextNode(element + '#' + this.id + ' .' + this.className + '  style ' +style);
  this.appendChild(child);
  child.appendChild(text);
  e.stopPropagation();//バブリングをストップ
  },false);
  
　　　　　　//マウスが離れたら表示場所を削除
  elem[i].addEventListener('mouseout',function(e){
  this.style.border = 'none';
  this.style.borderColor = '';
  var child = document.getElementById('child');
  child.parentNode.removeChild(child);
  e.stopPropagation();},false);
 }
}

今回はdivを作ってそこへ情報を流し込んでいますが、ツールチップみたいにしてもよさそうです。あとcssスタイルが改行されてないままテキストで出てるので、ちょっと読みにくいです。

投稿者 時刻: 0 件のコメント:
ラベル:

2012年5月20日日曜日

Wordpressの画像の扱い

wp_postテーブルのpost_contentへパスを含めたタグをそのまま入れている。 html生成時にそのままコンテンツと一緒に出力しているようだ。 画像ファイルはフォルダ（wp_content/uploads）以下に年数、月ごとにフォルダを作って配置してる。
投稿者 時刻: 0 件のコメント:
ラベル: ,

2012年4月25日水曜日

関数とコンストラクタの違い 


var x = 1;

var fn1 = function(){

　　print(this.x);

}; 　

fn1();
//結果は1。thisはfn1オブジェクトではなくグローバルを指している。

print(fn1.x);
//undefined

var fn2 = function(x){

　　this.x = x;
}:


var F1 = new fn2(10);
var F2 = new fn2(5);

print(F1.x);　//10
print(F2.x)　//5
//fn2内のthisは新規オブジェクトを指している。
関数実行時にnewをつけると，関数内でのthisの意味が変わり，「新規オブジェクト」を指すようになる。 newをつけて実行される関数は，新規オブジェクトの生成メソッド（コンストラクタ）として機能する。
投稿者 時刻: 0 件のコメント:
ラベル:

2012年4月23日月曜日

FirefoxでのinnerHTML

FirefoxでもinnerHTMLは使える。 要素をdocument.boxのようにではなくgetElementByIdで指定する。 
document.getElementById('text').innerHTML='hogehoge';
投稿者 時刻: 0 件のコメント:
ラベル:

JavaScript 　XMLファイルの読み込み

用意したXMLファイル 

<?xml version="1.0" encoding="utf-8"?>
　
　　
　　　1
　　　　大阪太郎
　　
　　
　　　2
　　　　京都越太朗
 
　　
　　　3
　　　　三重三郎
 
　
このXMLファイルを読み込む。 

<html>

外部XMLファイルの読み込み

 

 ボタンを押すとxmlを読み込んでdiv部分に表示する。
注意：Firefoxではそのまま表示されるが、ChromeやIEではサーバーを介してでないと表示されない。 IEやChromeではHTTPプロトコルで通信を行ったときのみXMLHttpRequestが動作する。
投稿者 時刻: 0 件のコメント:
ラベル:

JavaScript 文法まとめ

if-else文

if(i == 0)
  print("if clause");
else
  print("if clause");

switch-case文


var s = 'foo';

switch(s){

//s === 0が偽なので次へ
case 0:
 print('not here');
 break;

//s === s.lengthが偽なので次へ
case s.length:
 print('not here');
 break;

//s === (0).toStringが偽なので次へ
case(0).toString();
 print('not here');
 break;

//s === 'f' + 'o' + 'o';が真なので以下を実行
case 'f' + 'o' + 'o';
 print('here');
 break;

//もしすべてのcase式で同値演算が偽になれば、以下を実行
default:
 print('not here');
 break;
}
breakが無いと抜けないので注意。

while文


//紛らわしいインデント。２番目のprintは実際にはwhileループの外
while(flag)
 print("in loop");
 print("not in loop");

// ブロック文にすると構造が自明
while(flag){
 print("in loop");
 print("in loop");
 }

// ブロック文にすると構造が自明
while(flag){
 print("in loop");
 print("in loop");
 }

//文が一行でもブロック文にする
while(flag){
  print("in loop");
}
文中に他の文も書ける。 

//入れ子のwhile
while(flag){
 while(flag2){
  print("in double loop");
  }
}

//while文の中のif文
while(flag){
 if(flag2){
  print("in loop");
  }
}
条件式が常に真の場合、無限ループになる。クライアントサイドJavaScriptではバグになる。 whileループを抜けるには、
  1. ループ内で、条件式が偽になる場合を保証する
  2. ループ内にbreak文を書く
  3. ループ内にreturn文を書く
  4. ループ内から例外を投げる

//１０回ループが回るwhile文
var i = 0;
while (i < 10){
 print(i);
 i++;
}

do-while文

do-whileはwhileで十分事足りるのであまり使わないらしい。 do-whileを使うパターンは、事実上、次の２つ。
  1. 文を少なくとも１回実行しないと、条件式の評価に意味がでない場合
  2. 文を少なくとも１回実行することを保証したい場合

//do-whileを使う例
function printNumberFromRight(n){
 do {
  print(n % 10);
  n = ~~(n /10); //n /= 10と書くと結果が少数になる。~~演算は少数を整数にする（トリッキーな）技法
  } while (n > 0);
}

for文


//ループ変数iの宣言を初期化式で行う例
for (var i = 0; i < 10; i++){
 print(i);
}
※ここで変数iを参照できることに注意（スコープ内）
print("i =" + i);
//i = 10;

//有名なイディオム
for(var i = 0; i < 10; i++){
 print(i);
}

//ループ変数が１から始まり１０回まわるループ。特別な理由が無い限り使わない。
for(var i = 1; i <= 10; i++){
 print(i);
}

//複数のループ変数の例
for(var i = 0, J = 0; i < 10 && j < 10; i++, j++){

for in文


//オブジェクトのプロパティ名の列挙
var obj = { x:1, y:2, z:3 };
for (var k in obj){
 　　print(k);
}
//実行結果
x
y
z

//オブジェクトのプロパティ値の列挙
var obj = { x:1, y:2, z:3 };

for (var k in obj){
　　print(obj[k]);　//obj.kではundefinedになる
}

//実行結果
1
2
3

for each in文

ECMAScriptにはないJavaScript独自拡張。 for inと異なり、変数にプロパティ名ではなくプロパティ値が代入される。 

var obj = { x:1, y:2, z:3 };

for each (var v in obj){
　　print(v);
}
//実行結果
1
2
3

break文


while(true){
 〜
 if(ループを抜ける条件){
    break;
    }
}

continue文

ループの中にcontinue文を書くと、それ以降のループ内の文をスキップしてループの条件式の評価に戻る。 forループであれば更新式と条件式の評価に戻る。 

//ループ変数が偶数のときだけ処理をするforループ
for( var i = 0; i < 10; i++ ){
　　if(i % 2 == 0){
  処理
  }
}

//continue書き換え版
for( var i = 0; i < 10; i++ ){
　　if(i % 2 != 0){
　　　　continue;
  }
  処理
}

ラベルを使ったジャンプ


入れ子になったループをbreakでぬけると、抜けるのは内部のループだけ。
while(条件式){
　　print("outer loop");
　　while(条件式){
　　　print("inner loop");
　　　if(ループを抜ける条件){
　　　　break;
　　　　}
　　　}
}
抜けるためにラベルを使える。 

//ラベルを使い入れ子のループを同時に抜けるコード
outer_loop:
while(true){
 print("outer loop");
 while(true){
  print("inner loop");
  break outer_loop;
  }
}

return文

return文は関数の処理を中断し、指定した式の評価値を関数の返り値にする。 式が無い場合、関数の返り値はundefined値になる。 
return 式

throw文

throw文で例外オブジェクト（例外値）を投げられる。 
throw 式

try-catch-finally文

例外を補足する側はtry-catch-finally構文を使う。 catch節とfinally節の両方の省略はできない。 片方のみの省略は可能。 

//try文の実行例
try{
　　print('1');  
　　null.x;    //ここで強制的にTypeError例外を発生
　　print('not here');　　　　//ここは実行されない
}catch (e){    //オブジェクトeはTypeErrorオブジェクトを参照
　　print('2');
}finally{
　　print('3');
}
//実行結果
1
2
3

with文

with文は一時的に名前（変数や関数名）の解決順序を変更するために使う。 with文に与える式の型はオブジェクト型。他の型の式を与えるとオブジェクト型に型変換する。 with文の中での変数名の解決は、式に与えたオブジェクトのプロパティから探し始める。 ECMAScript第５版のstrictモードはwith文を禁止している。 

//with文の例
var x = 1;
var obj = { x:7, y:2 };
with (obj){
　　print(x);
}
//実行結果
7
投稿者 時刻: 0 件のコメント:
ラベル:

2012年4月19日木曜日

CakePHP入門　その１

独自のレイアウトを使う場合、app/views/layoutsに設置。
コントローラクラスの$layoutプロパティで指定する。
例：layout.ctpを使用する場合 
<?php
class TestController extends AppController{

 public $layout = 'layout';
 
 function index(){
 
 }
}
投稿者 時刻: 0 件のコメント:
ラベル:
登録: コメント (Atom)