2017年10月 / 09月≪ 12345678910111213141516171819202122232425262728293031≫11月

インフォメーション

FC2ブログで画像等を一括アップロードするソフトを地味に配布してます。
FC2ブログ用ファイルアップロードの最新版はこちら
(ベクター)FC2ブログ用ファイルアップロード

--.--.-- (--)

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。


 |  --:--  |  スポンサー広告  |  Top↑

2008.02.22 (Fri)

google-code-prettifyで色分けされたコードの中身を見てみる


<pre id="pre1" class="prettyprint">
for(int i = 0; i < 100; i++)
{
  if(i = 0) continue;
  n = n + i;
}
</pre>

このソースをgoogle-code-prettifyで色分けすると
up000004.jpg

こんな感じで色がつきます。

この状態で、色分けされた後のソースを見てみると

<PRE class=prettyprint id=pre1><SPAN class=kwd>for</SPAN><SPAN class=pun>(</SPAN><SPAN class=kwd>int</SPAN><SPAN class=pln>&nbsp;i&nbsp;</SPAN><SPAN class=pun>=</SPAN><SPAN class=pln>&nbsp;</SPAN><SPAN class=lit>0</SPAN><SPAN class=pun>;</SPAN><SPAN class=pln>&nbsp;i&nbsp;</SPAN><SPAN class=pun>&lt;</SPAN><SPAN class=pln>&nbsp;</SPAN><SPAN class=lit>100</SPAN><SPAN class=pun>;</SPAN><SPAN class=pln>&nbsp;i</SPAN><SPAN class=pun>++)</SPAN><SPAN class=pln><BR></SPAN><SPAN class=pun>{</SPAN><SPAN class=pln><BR>&nbsp; </SPAN><SPAN class=kwd>if</SPAN><SPAN class=pun>(</SPAN><SPAN class=pln>i&nbsp;</SPAN><SPAN class=pun>=</SPAN><SPAN class=pln>&nbsp;</SPAN><SPAN class=lit>0</SPAN><SPAN class=pun>)</SPAN><SPAN class=pln>&nbsp;</SPAN><SPAN class=kwd>continue</SPAN><SPAN class=pun>;</SPAN><SPAN class=pln><BR>&nbsp; n&nbsp;</SPAN><SPAN class=pun>=</SPAN><SPAN class=pln>&nbsp;n&nbsp;</SPAN><SPAN class=pun>+</SPAN><SPAN class=pln>&nbsp;i</SPAN><SPAN class=pun>;</SPAN><SPAN class=pln><BR></SPAN><SPAN class=pun>}</SPAN></PRE>pre2 <PRE id=pre2>for(int i = 0; i &lt; 100; i++) { if(i = 0) continue; n = n + i; }</PRE>

改行がなくなっています。


この状態のpre1の子ノード(n)、孫ノード(nn)を取得し、下記のような表示形式で表示してみます。

n.nodeName = [n.nodeValue] type:n.nodeType cld:n.childNode.length
  nn.nodeName = [nn.nodeValue] type:nn.nodeType cld:nn.childNode.length

[スクリプト]

<div id="dsp">
</div>

<script language="JavaScript">
<!--

var pre1 = document.getElementById("pre1");
var str = "";
for(i = 0; i < pre1.childNodes.length; i++)
{
  var n = pre1.childNodes.item(i);
  str +=  n.nodeName + " = " + n.nodeValue + " type:" + n.nodeType + " cld:" + n.childNodes.length + "\r\n";
  for(j = 0; j < n.childNodes.length; j++)
  {
    nn = n.childNodes.item(j);
  str +=  "  " + nn.nodeName + " = [" + nn.nodeValue + "] type:" + nn.nodeType + " cld:" + nn.childNodes.length + "\r\n";
  }
}
document.getElementById("dsp").innerText = str;
-->
</script>

[表示]

SPAN = null type:1 cld:1
  #text = [for] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [(] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [int] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [ i ] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [=] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [ ] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [0] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [;] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [ i ] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [<] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [ ] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [100] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [;] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [ i] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [++)] type:3 cld:0
SPAN = null type:1 cld:1
  BR = [null] type:1 cld:0
SPAN = null type:1 cld:1
  #text = [{] type:3 cld:0
SPAN = null type:1 cld:2
  BR = [null] type:1 cld:0
  #text = [  ] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [if] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [(] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [i ] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [=] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [ ] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [0] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [)] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [ ] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [continue] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [;] type:3 cld:0
SPAN = null type:1 cld:2
  BR = [null] type:1 cld:0
  #text = [  n ] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [=] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [ n ] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [+] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [ i] type:3 cld:0
SPAN = null type:1 cld:1
  #text = [;] type:3 cld:0
SPAN = null type:1 cld:1
  BR = [null] type:1 cld:0
SPAN = null type:1 cld:1
  #text = [}] type:3 cld:0


改行タグ<BR>はSPANタグに囲まれているんだなってことがわかりました。

nodeType=1がエレメント、nodeType=3がテキストノードを表しているらしい。


もうしばらく模索します・・・


 |  16:38  |  JavaScript  |  トラックバック(0)  |  Top↑

Trackback

この記事のトラックバックURL

この記事へのトラックバック

 | BLOGTOP | 
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。