html object] element 를 추적하다...

관련글 : - xml & xsl] ktours' to xml(moded sample) to blog...2 -

어제... html 을 xml 로 변환하기 위해 element 를 추적해야할거라는 얘기를 했는데...

잘 진행될지 모르겠지만, 일단 source 를 뽑고, 진행을 계속해본다.

...

<div id=x1><b>여의도 남측 조금 건너편에서...</b><br /><br /><TABLE style="BORDER-BOTTOM: #dedede 1px solid; BORDER-LEFT: #dedede 1px solid; BACKGROUND: url(http://img.cyworld.com/img/map/map_icon.gif) #fff no-repeat 7px 3px; BORDER-TOP: #dedede 1px solid; BORDER-RIGHT: #dedede 1px solid; -moz-border-radius: 10px"><TBODY><TR><TD><A style="COLOR: #666; TEXT-DECORATION: none" id=map_id href="http://map.cyworld.com/menu/view.map?map_id=854636" name=854636_1 target=_blank tp_privilege="P"><DIV style="TEXT-ALIGN: left; PADDING-BOTTOM: 0px; PADDING-LEFT: 20px; PADDING-RIGHT: 3px; FONT: 12px 돋움; PADDING-TOP: 3px">대한민국 한강 여의도남측조금건너</DIV></A></TD></TR></TBODY></TABLE><br /> <br />지나가다가... 공사가 어느정도(?) 마무리됐음을 느끼고 진입해봤다.<br />뭐랄까... 예전에 봤던 모래사장(?)이 안보인다고 해야하나...<br /> <br />매년 새들이 쉬고가는 장소로 기억하던 곳인데...<br /> <br />NowMark killofki@.<br /> <br /><a num=1>1) 63빌딩</a><br /><a num=2>2) 원효대교</a><br /><a num=3>3) 한강철교
</a><br /><br /></div>
<div id=x2></div>
<script>

function AttrNStyle(obj) {
var ov='', c, i, j;

ov+='* Attributes *\n\r';
c=obj.attributes;

ov+=c+'\n\r';

for (i in c) {

if (i!='contentEditable')
if (i!='className')
if (i!='style_Str')
if (i!='length')


if (typeof(c[i])=='object') {
if (c[i]['value'])
if (c[i]['value']!='null')
if (c[i]['value']!='false')
if (c[i]['value']!='0')
{
ov+=i+'\n\r';
for (j in c[i]) {
if (c[i][j])

if (j!='nodeType')
if (j!='nodeName')
if (j!='nodeValue')
if (j!='specified')
if (j!='ownerDocument')

ov+='- '+j+':'+c[i][j]+'\n\r';
}
}
}
else if (c[i]) { ov+=i+' : '+c[i]+'\n\r'; }

}
ov+='\n\r\n\r';

ov+='* style *\n\r';
c=obj.style;
for (i in c) {

if (i!='contentEditable')
if (i!='className')
if (i!='style_Str')
if (i!='length')
if (typeof(c[i])=='object') {
if (c[i]['value'])
if (c[i]['value']!='null')
if (c[i]['value']!='false')
if (c[i]['value']!='0')
{
ov+=i+'\n\r';
for (j in c[i]) {
if (c[i][j])
ov+='- '+j+':'+c[i][j]+'\n\r';
}
}
}
else if (c[i]) { ov+=i+' : '+c[i]+'\n\r'; }

}
ov+='\n\r\n\r';

return ov;
}

function eleShow(oobj) {
var oov='', cN, cNn, iii, jjj;

oov+=AttrNStyle(oobj);
//

oov+='* children *\n\r';

cN=oobj.firstChild;

iii=0;

///
try {
///

while(cN) {
iii++; if (iii>100) break;

oov+=cN.nodeName+'/';
if (cN['nodeValue']) {
oov+='- '+cN.nodeValue;
cNn=cN.nextSibling;
while (!cNn) { oov+='^-\n\r';
cN=cN.parentNode; if (cN==oobj) break; cNn=cN.nextSibling; }
cN=cNn;
}
else if (cN['firstChild']) {
oov+='_.\n\r';
cN=cN.firstChild;
}
else if (cN['nextSibling']) {
oov+='#.\n\r';
cN=cN.nextSibling;
}
else
{
oov+='^\n\r';
cN=cN.parentNode;
if (cN==oobj) break;
cNn=cN.nextSibling;
while (!cNn) { oov+='^^\n\r';
cN=cN.parentNode; if (cN==oobj) break; cNn=cN.nextSibling; }
cN=cNn;
}
oov+='\n\r';

}

//


///
} catch(err) { }
///


document.getElementById("x2").innerText=oov;
}

eleShow(document.getElementById("x1"));
</script>
<br><br>

...

음... document 를 구성하는 중간에 eleShow 를 가동시켜서
x1 밑 x2 에 x1 의 child를 뽑는 형식으로 진행됐다.

... 아직 미완성(?)이라 try & catch 가 남아있고...

이리저리(?) 검색하다가 firstChild , nextSibling , parentNode , nodeValue 등(?)에 관한 방향을 잡고(?),
진행시켜 본 것...
( parentNode 부분에서 많이 헥갈렸다... oobj 가 어디로 튈지 모르니까...)

결과는

...

여의도 남측 조금 건너편에서...

대한민국 한강 여의도남측조금건너

 
지나가다가... 공사가 어느정도(?) 마무리됐음을 느끼고 진입해봤다.
뭐랄까... 예전에 봤던 모래사장(?)이 안보인다고 해야하나...
 
매년 새들이 쉬고가는 장소로 기억하던 곳인데...
 
NowMark killofki@.
 
1) 63빌딩
2) 원효대교
3) 한강철교

...

기존에 local 에서 진행된 형태와 결과값이 조금 다르긴 하지만...
이렇게 나왔다.
(음... while 문이 들어간 스크립트인데... 오류 안생길라나... iii 로 break point 는 잡아두긴 했지만...)

IE 에서만 이렇게 나올 것 같은데... test 해봐야할 듯...

OTL... IE 에서만 스크립트 작동한다...
(뭐... 결국은 IE 전용으로 쓰게 되겠지만...)

...

중간에 오류가 나서 그런건지, 아니면 attr 에서만 오류가 난건지 AttNStyle 을 try & catch 로 묶어봤더니
FF 에서는 결과가 안나왔지만, Chrome 과 Safari 에서는 오류났다는 결과물을 보여줬다.
(그래도, 아얘 멈추는 사태는 없어서 다행...)

- Chrome 과 Safari 를 위해 수정했던 부분 -

function eleShow(oobj) {
var oov='', cN, cNn, iii, jjj;

try {
oov+=AttrNStyle(oobj);
} catch(err) {
oov+="\n\r: can not Access Attrs :\n\r\n\r";
}
//

...

이제, base 는 어느정도(?) 갖춰놨고...
xml 로 다시 서술하기 위해 조금 더 진행을 해야할 듯...

NowMark killofki@.