넥사크로 컴포넌트의 HTML 요소 찾기 — _unique_id 로 Static 글자 흘리기

넥사크로 HTML5 화면에서 Static 같은 컴포넌트를 개발자도구 Elements 탭으로 보면, 모두 div 로 그려져 있고 id 가 컴포넌트 경로를 따라 규칙적으로 붙어 있다.

<div id="mainframe.WrapFrame.form.div_work.form.div_search.form.stt_baseDt" ...>
  <div id="mainframe.WrapFrame.form.div_work.form.div_search.form.stt_baseDt:text" ...>기준일자</div>
</div>

(경로는 프레임 구성에 따라 길이가 다르다. 위는 줄인 예시)

_unique_id 로 경로 얻기

컴포넌트 객체의 _unique_id 속성을 보면 이 div 의 id 와 같은 전체 경로가 들어 있다.

this.div_search.form.stt_baseDt._unique_id;
// 'mainframe.WrapFrame.form.div_work.form.div_search.form.stt_baseDt'

여기에 글자를 담는 자식 요소의 접미사 :text 를 붙이면 Static 글자가 들어 있는 요소를 바로 잡을 수 있다. 장난삼아 글자를 흘러가게 만들어 봤다.

var id = this.div_search.form.stt_baseDt._unique_id + ":text";
var el = document.getElementById(id);
if (el) {
  el.innerHTML = "<marquee>기준일자</marquee>";
}

실험으로만 쓸 것

재미로 해 본 것이고, 업무 화면에 쓰면 안 된다.

• _unique_id 와 :text 같은 요소 구조는 공식 API 가 아니다. 이름이 _ 로 시작하는 내부 속성이라 버전이 바뀌면 달라질 수 있다. 위 구조는 2025년 초에 쓰던 프로젝트의 HTML5 화면에서 확인한 것이다
• 넥사크로는 text 속성이 바뀌거나 화면을 다시 그릴 때 이 요소를 새로 쓴다. DOM 을 직접 고친 내용은 그때 사라진다. 글자를 바꾸려면 set_text() 를 쓴다
• <marquee> 는 HTML 표준에서 폐기(obsolete)된 요소다. 브라우저들이 아직 그려 주기는 하지만, 움직이는 효과가 정말 필요하면 CSS 애니메이션을 쓴다
• 넥사크로 런타임(데스크톱 실행 환경)에서는 HTML 요소가 아니므로 이 방법이 통하지 않는다

디버깅할 때는 유용하다. 화면에서 어떤 요소가 어느 컴포넌트인지 헷갈리면, Elements 탭에서 요소를 고르고 id 를 보면 바로 컴포넌트 경로를 알 수 있다.

다시 쓰며 바로잡은 점

• 내부 속성이라 버전에 따라 달라질 수 있고, 넥사크로가 다시 그리면 덮어써진다는 주의를 덧붙였다
• <marquee> 가 폐기된 요소라는 점과 대안(CSS 애니메이션), 글자 변경은 set_text() 로 한다는 점을 적었다
• 예제의 화면 id 와 컴포넌트 이름은 일반적인 이름으로 바꿨다