KR101975616B1 - 소스 코드를 실행 요소에 링크시키는 기법 - Google Patents

소스 코드를 실행 요소에 링크시키는 기법 Download PDF

Info

Publication number
KR101975616B1
KR101975616B1 KR1020137033973A KR20137033973A KR101975616B1 KR 101975616 B1 KR101975616 B1 KR 101975616B1 KR 1020137033973 A KR1020137033973 A KR 1020137033973A KR 20137033973 A KR20137033973 A KR 20137033973A KR 101975616 B1 KR101975616 B1 KR 101975616B1
Authority
KR
South Korea
Prior art keywords
document
text
dom
node tree
node
Prior art date
Application number
KR1020137033973A
Other languages
English (en)
Other versions
KR20140038469A (ko
Inventor
마이클 씨 패닝
매튜 홀
개리 린스콧
펠릭스 지티아이 앤드류
케네스 에이 쇼맨
이브게니 티보런
Original Assignee
마이크로소프트 테크놀로지 라이센싱, 엘엘씨
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 마이크로소프트 테크놀로지 라이센싱, 엘엘씨 filed Critical 마이크로소프트 테크놀로지 라이센싱, 엘엘씨
Publication of KR20140038469A publication Critical patent/KR20140038469A/ko
Application granted granted Critical
Publication of KR101975616B1 publication Critical patent/KR101975616B1/ko

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/957Browsing optimisation, e.g. caching or content distillation
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/80Information retrieval; Database structures therefor; File system structures therefor of semi-structured data, e.g. markup language structured data such as SGML, XML or HTML
    • G06F16/84Mapping; Conversion
    • G06F16/88Mark-up to mark-up conversion
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F17/00Digital computing or data processing equipment or methods, specially adapted for specific functions

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Databases & Information Systems (AREA)
  • Physics & Mathematics (AREA)
  • Data Mining & Analysis (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Mathematical Physics (AREA)
  • Software Systems (AREA)
  • Document Processing Apparatus (AREA)
  • Information Transfer Between Computers (AREA)
  • Stored Programmes (AREA)

Abstract

본 발명에 따른 방법은 텍스트 소스 문서를 파싱하여 문서 노트 트리를 구성하되, 문서 노드 트리의 각 노드에 대응하는 텍스트 소스 문서 내 텍스트의 위치를 나타내는 텍스트 오프셋을 포함하도록 문서 노트 트리를 구성하는 단계를 포함한다. 이 방법은 문서 노드 트리로부터 DOM(Document Object Model) 및 DOM을 나타내는 뷰 노드 트리를 구성하는 단계를 포함한다. 뷰 노드 트리를 구성하는 단계는 뷰 노드 트리를 문서 노드 트리에 맵핑하는 단계를 포함한다. 이 방법은 DOM의 DOM 요소들이 뷰 노드 트리 및 문서 노드 트리를 통해 DOM 요소에 대응하는 텍스트 소스 문서 내의 텍스트에 링크되도록 DOM의 실행 표시(running representation)를 제공하는 단계를 포함한다.

Description

소스 코드를 실행 요소에 링크시키는 기법{LINKING SOURCE CODE TO RUNNING ELEMENT}
웹 개발 툴은 개발자들이 HTML(HyperText Markup Language) 및 CSS(Cascading Style Sheet) 문제를 진단할 수 있게 한다. 개발자들은 CSS 선택기를 포함하는 DOM(Document Object Model) 요소를 동적으로 수정할 수 있고 브라우저 내 실행 페이지(running page)에서 반영된 변경사항들을 바로 볼 수 있다. 그러나, 변경사항들을 그 페이지가 만들어진 마크업 텍스트 소스 문서에 영구적으로 적용하기 위해, 개발자는 원하는 수정과 연관된 마크업 텍스트 또는 생성된 자바스크립트를 찾아서 적절히 수정할 필요가 있다. 그러나, 원하는 수정사항과 연관된 소스 코드 텍스트를 찾는 것은 어려울 수 있는데, 이는 연관된 마크업 텍스트가 바로 명확하지 않을 수 있거나 또는 개발자가 익숙하지 않은 코드로 만들었을 수 있기 때문이다.
본 요약부는 이하 발명의 상세한 설명에서 보다 자세히 기술될 개념들 중 선택된 것들을 단순화된 형식으로 소개하기 위해 제공된다. 본 요약부는 청구항에 기재된 청구대상의 주된 사항 또는 핵심 사항을 밝히기 위한 것이 아니며, 청구항에 기재된 청구대상의 범위를 한정하기 위한 것은 더더욱 아니다.
일실시예는 텍스트 소스 문서를 분석하여 문서 노트 트리를 구성하되, 문서 노드 트리의 각 노드에 대응하는 텍스트 소스 문서 내 텍스트의 위치를 나타내는 텍스트 오프셋을 포함하도록 문서 노트 트리를 구성하는 것을 포함하는 방법을 제공한다. 이 방법은 문서 노드 트리로부터 DOM(Document Object Model) 및 DOM을 나타내는 뷰 노드 트리를 구성하는 단계를 포함한다. 뷰 노드 트리를 구성하는 단계는 뷰 노드 트리를 문서 노드 트리에 맵핑하는 단계를 포함한다. 이 방법은 DOM의 DOM 요소들이 뷰 노드 트리 및 문서 노드 트리를 통해 DOM 요소에 대응하는 텍스트 소스 문서 내의 텍스트에 링크되도록 DOM의 실행 표시(running representation)를 제공하는 단계를 포함한다.
첨부 도면은 실시예들을 보다 깊이 이해하기 위해 포함되며 본 명세서에 포함되어 그 일부를 구성한다. 도면들은 실시예들을 도시하며 상세한 설명과 함께 실시예들의 원리를 설명하는 역할을 한다. 다른 실시예들 및 실시예들의 많은 이점들은, 하기 상세한 설명을 참조하면 보다 잘 이해될 것이므로, 쉽게 이해할 수 있을 것이다. 도면들의 구성요소는 서로에 대해 반드시 축척으로 되어 있지는 않다. 유사한 참조번호는 대응하는 유사한 부분을 나타낸다.
도 1은 웹 개발 툴의 일실시예를 도시한 블록도이다.
도 2는 도 1에 도시된 웹 개발 툴의 특징들을 구현하는데 적합한 컴퓨팅 장치/환경의 일실시예를 도시한 블록도이다.
도 3은 웹 개발 툴의 일실시예를 도시한 기능적 블록도이다.
도 4는 문서 노드 트리에 맵핑된 HTML 텍스트의 일례를 도시한 블록도이다.
도 5는 뷰 노드 트리에 맵핑된 문서 노드 트리의 일례를 도시한 블록도이다.
도 6은 브라우저 인스턴스로 표시된 DOM에 대한 뷰 노드 트리의 일례를 도시한 블록도이다.
도 7은 소스 코드 편집기 내 마크업 텍스트를 브라우저에 표시된 관련 DOM 요소에 링크시키는 방법의 일실시예를 도시한 순서도이다.
도 8은 문서 노드 트리의 노드들의 텍스트 오프셋을 업데이트하거나 무효화하는 방법의 일실시예를 도시한 순서도이다.
하기 상세한 설명은 본 명세서의 일부를 형성하는 첨부 도면을 참조하여 기술되며, 도면들은 본 발명이 실시될 수 있는 예시적인 특정 실시예들을 도시한다. 다른 실시예들이 이용될 수도 있고 본 발명의 범주로부터 벗어나지 않으면서 구조적 또는 논리적 변경이 이루어질 수도 있음을 이해해야 한다. 따라서, 하기 상세한 설명은 제한적인 의미로 받아들여져서는 안 되며, 본 발명의 범위는 첨부한 청구범위에 의해 정의된다.
본 명세서에 기술된 다양한 실시예들의 특징들은 달리 언급되지 않는 한 서로 조합될 수 있음을 이해해야 한다.
도 1은 웹 개발 툴(100)의 일실시예를 도시한 블록도이다. 웹 개발 툴(100)은 텍스트 소스 문서(102) 및 텍스트 소스 문서의 실행 표시(104)를 포함한다. 일실시예에서, 텍스트 소스 문서(102)는 웹 페이지 소스 코드 편집기에서 열린다. 다른 실시예에서는 텍스트 소스 문서(102) 또는 텍스트 소스 문서(102)의 부분들이 웹 페이지 소스 코드 뷰어에 디스플레이된다. 일실시예에서, 텍스트 소스 문서(102)의 실행 표시(104)는 브라우저에 의해 제공된다. 다른 실시예에서, 텍스트 소스 문서(102)의 실행 표시(104)는 텍스트 소스 문서의 실행 표시의 설계자, 속성 창 또는 기타 적절한 시각화(visualization)에 의해 제공된다.
텍스트 소스 문서(102)의 웹 페이지 소스 코드는 링크(112)를 통해, 실행 표시(104)에 의해 표시된 웹 페이지의 실행 페이지 인스턴스 내 관련 DOM(Document Object Model)(110) 요소에 링크된다. 따라서, 실행 표시(104) 내의 DOM 요소를 선택하거나 또는 강조(highlighting)함으로써, 선택되거나 강조된 DOM 요소와 연관된 웹 페이지 텍스트가 텍스트 소스 문서(102) 내에서 선택되거나 또는 강조된다. 마찬가지로, 텍스트 소스 문서(102) 내 웹 페이지 텍스트의 일부를 선택하거나 또는 강조함으로써, DOM 요소 또는 웹 페이지 텍스트의 선택되거나 강조된 부분과 연관된 요소가 실행 표시(104) 내에서 선택되거나 또는 강조된다. 이런 방식으로, 웹 페이지 개발자는, DOM 요소가 웹 페이지의 실행 인스턴스로 표시되므로, DOM 요소를 DOM 요소를 정의하는 웹 페이지 텍스트 소스 코드와 바로 매칭시킬 수 있다.
일실시예에서, 텍스트 소스 문서(102)는 소스 코드 편집기에서 열리는데, 이 소스 코드 편집기는 웹 페이지 텍스트 소스 문서를 열고, 생성하고, 편집하고 저장하는데 적합한 임의의 적절한 텍스트 편집기를 포함한다. 일실시예에서, 소스 코드 편집기에 의해 편집될 수 있는 웹 페이지 텍스트 소스 문서는 HTML(HyperText Markup, Language), CSS(Cascading Style Sheet), XML(Extensible Markup Language) 및/또는 XHTML(Extensible HyperText Markup, Language)과 같은 마크업 텍스트를 포함한다. 웹 페이지 텍스트 소스 문서는 또한 JavaScript 또는 JScript를 포함할 수도 있다. 본 명세서에 사용된 바와 같이, "JS"는 JavaScript 또는 JScript 모두를 지칭하는데 사용된다. 다른 실시예에서, 소스 코드 편집기는 다른 적절한 웹 페이지 마크업 텍스트 및 스크립팅 언어를 포함하는 웹 페이지 텍스트 소스 문서를 열고, 생성하고, 편집하고 저장하기에 적합하다. 일실시예에서, 소스 코드 편집기는, 관련되고 링크된 웹 페이지 텍스트 소스 문서들이 소스 코드 편집기 내에서 동시에 열릴 수 있도록 웹 페이지 텍스트 소스 문서의 복수의 인스턴스를 지원한다.
일실시예에서, 실행 표시(104)는 DOM(110)을 표시하는데 적합한 웹 브라우저이다. 일실시예에서, 브라우저는 W3C(World Wide Web Consortium) 규격의(compliant) 웹 브라우저이다. 일실시예에서, 브라우저는 DOM(110)의 표시가 인터넷 익스플로러(Internet Explorer), 파이어폭스(FireFox), 크롬(Chrome), 사파리(Safari) 또는 오페라(Opera)와 같은 임의의 특정 브라우저에 의존하지 않도록 DOM(110)의 브라우저 애그노스틱(agnostic) 표시를 제공한다. 다른 실시예에서, 브라우저는 DOM(110)의 표시가 선택된 브라우저에 기초하도록 선택된다. 브라우저는 사용자가 인터넷 익스플로러, 파이어 폭스, 크롬, 사파리 또는 오페라와 같은 특정 브라우저를 선택할 옵션을 포함할 수 있다. 일실시예에서, 브라우저는, 관련되고 링크된 웹 페이지 텍스트 소스 문서들이 소스 코드 편집기 내에서 동시에 열릴 수 있도록, DOM의 복수의 인스턴스를 지원한다.
실행 표시(104)는 또한 실행 스크립트(108) 및 API(Application Programming Interface)를 포함할 수 있다. 스크립트(108) 및 API(106)는 실행 표시(104) 내 DOM(110)의 DOM 요소를 수정할 수 있다. 일실시예에서, DOM(110)의 실행 표시에 대한 수정으로 인해 DOM(110)의 실행 표시(104)로 더 이상 표시되지 않는 텍스트 소스 문서(102)의 부분들은, 예컨대 시각적 표시자를 통해 표시된다. 일실시예에서, 실행 표시(104) 내 DOM 요소를 선택하는 것에 응답하여, DOM 요소와 연관된 소스 문서(102) 내 소스 코드의 위치가 사용자에게 보고된다.
도 2는 도 1과 관련하여 설명한 웹 개발 툴(100)의 특징들을 구현하기에 적합한 컴퓨팅 장치/환경(200)의 일실시예를 도시한 블록도이다. 컴퓨팅 장치/환경(200)은 하나 이상의 처리 유닛(212) 및 시스템 메모리를 포함한다. 컴퓨팅 장치/환경(200)의 정확한 구성 및 유형에 따라, 메모리(214)는 휘발성(예컨대, RAM), 비휘발성(예컨대, ROM, 플래시 메모리 등) 또는 이 둘의 일부 조합일 수 있다.
컴퓨팅 장치/환경(200)은 또한 추가적인 특징들/기능을 가질 수도 있다. 예컨대, 컴퓨팅 장치/환경(200)은 또한 제한적인 것은 아니지만 자기 또는 광학 디스크 또는 테이프를 포함하는 추가적인 저장부(착탈식 및/또는 비착탈식)를 포함할 수도 있다. 그러한 추가적인 저장부가 도 2에 착탈식 저장부(216) 및 비착탈식 저장부(218)로 도시되어 있다. 컴퓨터 저장 매체는 컴퓨터 판독가능한 명령어, 데이터 구조, 프로그램 모듈 또는 기타 데이터와 같은 정보의 저장을 위해 임의의 적절한 방법 또는 기술로 구현된 휘발성 및 비휘발성, 착탈식 및 비착탈식 매체를 포함한다. 메모리(214), 착탈식 저장부(216) 및 비착탈식 저장부(218)는 모두 컴퓨터 저장 매체의 예들이다(예컨대, 컴퓨터 판독가능 저장 매체는 적어도 하나의 프로세서에 의해 실행될 경우 적어도 하나의 프로세서로 하여금 방법을 수행하게 하는 컴퓨터 실행가능 명령어를 저장한다). 컴퓨터 저장 매체는 RAM, ROM, EEPROM, 플래시 메모리 또는 다른 메모리 기술, CD-ROM, DVD 또는 기타 광학 저장 장치, 자기 카세트, 자기 테이프, 자기 디스크 저장 장치 또는 기타 자기 저장 장치, 또는 원하는 정보를 저장하는데 사용될 수 있고 컴퓨팅 장치/환경(200)에 의해 액세스될 수 있는 임의의 기타 매체를 포함하지만, 이들에 제한되지는 않는다. 임의의 그러한 컴퓨터 저장 매체는 컴퓨팅 장치/환경(200)의 일부일 수 있다.
컴퓨팅 장치/환경(200)의 다양한 요소들은 하나 이상의 통신 링크(215)를 통해 함께 통신가능하게 결합된다. 컴퓨팅 장치/환경(200)은 또한 컴퓨팅 장치/환경(200)이 다른 컴퓨팅 장치/환경(226)과 통신할 수 있게 하는 하나 이상의 통신 접속부(224)를 포함한다. 컴퓨팅 장치/환경(200)은 또한 키보드, 포인팅 장치(예컨대, 마우스), 펜, 음성 입력 장치, 터치 입력 장치 등과 같은 입력 장치(222)를 포함할 수 있다. 컴퓨팅 장치/환경(200)은 또한 디스플레이, 스피커, 프린트 등과 같은 출력 장치(220)를 포함할 수 있다.
도 2 및 전술한 내용은 하나 이상의 실시예들이 구현될 수 있는 적절한 컴퓨팅 환경을 일반적으로 간략히 설명하기 위한 것이며, 실시예들의 사용 범위 또는 기능성에 대한 어떠한 제한을 암시하고자 하는 것은 아니다.
도 3은 웹 개발 툴(300)의 일실시예를 도시한 기능적인 블록도이다. 일실시예에서, 웹 개발 툴(300)은 앞서 기술된 도 1과 관련하여 예시한 웹 개발 툴(100)을 제공한다. 웹 개발 툴(300)은 마크업 텍스트(302), 마크업 파서(306), 문서 노드 트리(310), DOM 빌더(builder)(314), 브라우저(318) 및 DOM 수정 리스너(modification listener)(322)를 포함한다. 304로 표시된 바와 같이 마크업 텍스트(302)는 마크업 파서(306)에 입력된다. 308로 표시된 바와 같이 마크업 파서(306)는 문서 노드 트리(310)를 출력한다. 312로 표시된 바와 같이 문서 노드 트리(310)는 DOM 빌더(314)에 입력된다. 316으로 표시된 바와 같이 DOM 빌더(314)는 DOM을 브라우저(318)에 출력한다. 320으로 표시된 바와 같이 DOM 수정 리스너(listener)(322)는 브라우저(318) 내의 DOM 요소에 대한 변경사항을 추적한다. 324로 표시된 바와 같이 DOM 수정 리스너(322)는 변경 정보를 문서 노드 트리(310)에 출력한다.
마크업 텍스트(302)는 HTML, CSS, XML, XHTML 및/또는 기타 적절한 마크업 텍스트를 포함한다. 일실시예에서, 마크업 텍스트(302)를 포함하는 소스 문서는 소스 코드 편집기에서 열린다. 다른 실시예에서, 웹 개발 툴(300)은 소스 코드 편집기에서 소스 문서를 열지 않고 마크업 텍스트(302)를 포함하는 소스 문서에 액세스한다. 마크업 텍스트(302)는 웹 페이지를 제공하기 위한 적절한 수의 객체를 정의한다. 도 3에 도시된 실시예에서, 마크업 텍스트(302)는 HTML을 포함한다. 예시적인 HTML은 텍스트 "Hello"를 포함하는 DOM 요소를 제공하는 하나의 객체를 정의한다.
마크업 텍스트(302)의 텍스트 특성으로 인해, 마크업 텍스트(302)의 각 문자는 326으로 표시된 바와 같이 대응하는 라인 번호 및 328로 표시된 바와 같이 라인에 대한 대응하는 문자 번호를 갖는다. 예를 들어, 마크업 텍스트(302) 내의 문자("H")는 2 라인 8번째 문자이다. 마크업 텍스트(302)의 각 문자는 또한 마크업 텍스트(302)의 시작에 대한 문자의 위치를 나타내는 문자 번호를 갖는다. 예를 들어, 마크업 텍스트(302) 내의 문자 "H"는 마크업 텍스트(302)에서 26번째 문자이기 때문에 26의 문자 번호를 갖는다. 따라서, 마크업 텍스트(302) 내의 각 문자는 라인 번호 및 라인 내 위치에 기초하거나 또는 마크업 텍스트(302)의 시작에 대한 문자의 위치를 나타내는 문자 번호에 기초하여 찾아낼 수 있다. 마찬가지로, 마크업 텍스트(302) 내 문자열은 일련의 라인 번호 및 라인 내 위치에 기초하거나 또는 일련의 문자 번호에 기초하여 찾아낼 수 있다. 본 명세서에서 사용되는 바와 같이, 라인 번호 및 라인들 내에서의 이들 일련의 위치 또는 일련의 문자 번호를 "텍스트 오프셋(text offset)"이라 한다.
마크업 텍스트(302)는 문서 노드 트리(310)를 구성하기 위해 마크업 파서(306)에 의해 파싱된다. 일실시예에서, 마크업 파서(306)는 소스 코드 편집기와 동일한 컴퓨팅 장치/환경에 위치한다. 다른 실시예에서, 마크업 파서(306)는 소스 코드 편집기와 상이한 컴퓨팅 장치/환경에 위치한다. 마크업 파서(306)는 HTML 파서, CSS 파서, XML 파서, XHTML 파서 및/또는 다른 적절한 마크업 텍스트 파서를 포함한다. 일실시예에서, 마크업 파서(306)는 W3C에 따른다. 다른 실시예에서, 마크업 파서(306)는 인터넷 익스플로러, 파이어폭스, 크롬, 사파리 또는 오페라와 같은 특정 브라우저와 연관된 파서에 기초한다. 다른 실시예에서, 마크업 파서(306)는 특정 브라우저 런타임 실행 및/또는 파스 동작의 지식에 기초한 파싱 구현에서의 변경을 갖는 특정 브라우저와 연관된 파서의 기본 구현을 포함하는 하이브리드 파서이다.
마크업 파서(306)는 문서 노드 트리(310) 내에 웹 페이지와 관련이 있는 마크업 텍스트(302)로부터의 소스 문서 세부사항을 포함한다. HTML 객체 및 CSS 객체 외에, 마크업 파서(306)는 브라우저에 의해 해석될 수 있는 문서 유형(doctype) 및 소스 내 코멘트(in-source comment)와 같은 마크업 텍스트(302)로부터의 기타 세부사항을 포함한다. 마크업 파서(306)는 또한 마크업 텍스트(302) 내 소스 문서 세부사항의 위치를 나타내는 문서 노드 트리(310) 내에서의 텍스트 오프셋을 포함한다. 텍스트 오프셋은 문서 노드 트리(310)의 각 노드를 노드와 연관된 마크업 텍스트에 맵핑한다. 이런 방식으로, 파싱 프로세스 동안에 문서 노드 트리(310) 및 마크업 텍스트(302) 간의 링크가 유지된다. 이것은 마크업 파서(306)를 브라우저 내에 통합된 종래의 파서와 구별짓는데, 이 종래의 파서는 성능상의 이유로 렌더링 동안 소스 문서 세부사항을 폐기하거나 변환하며 소스 문서와 렌더링된 문서 사이에 어떠한 링크도 유지하지 않는다.
도 3에 도시된 예에서, 문서 노드 트리(310)는 일련의 문자 번호를 텍스트 오프셋으로 사용한다. 예를 들어, 문서 노드 트리(310)는 부모 노드 "DIV"에 대해 텍스트 오프셋 "text span:1-42"를 포함하는데, 이는 마크업 텍스트(302) 내 객체 "DIV"의 위치를 나타낸다. 마찬가지로, 문서 노드 트리(310)는 속성 "id"에 대해 텍스트 오프셋 "text span:6-15"를 포함하고, 자식(child) 노드 "P"에 대해 텍스트 오프셋 "text span:23-34"을, 그리고 자식 노드 "Hello"에 대해 텍스트 오프셋 "text span:26-30"을 포함한다. 따라서, 문서 노드 트리(310) 내에 각 객체에 대한 텍스트 오프셋을 포함시킴으로써, 문서 노드 트리(310) 내 각 객체는 그 객체와 연관되는 소스 문서 마크업 텍스트에 맵핑된다.
DOM 빌더(314)는 문서 노드 트리(310)로부터 DOM 및 DOM을 나타내는 뷰 노드 트리를 구성한다. DOM 빌더(314)는 DOM의 각 요소가 문서 노드 트리(310) 내의 연관된 객체에 링크되어 객체와 연관되는 소스 문서 마크업 텍스트에 맵핑되도록 뷰 노드 트리의 각 노드를 문서 노드 트리의 대응하는 노드에 맵핑시킨다.
일실시예에서, DOM 빌더(314)는 JS 요소를 구성한다. JS 요소는, 실행되면, DOM 요소 및 뷰 노드 트리 내의 대응 노드를 구성하고/또는 수정할 수 있는데, 문서 노드 트리(310) 내 대응 노드는 갖지 않을 수도 있다.
일실시예에서, DOM 빌더(314)는 인터넷 익스플로러, 파이어폭스, 크롬, 사파리 또는 오페라와 같은 임의의 특정 브라우저에 의존하지 않는 브라우저 애그노스틱 DOM을 구성한다. 다른 실시예에서, DOM 빌더(314)는 DOM이 선택된 브라우저에 기초하여 구성되도록 선택된다. DOM 빌더(314)는 DOM의 구성의 기초가 되는 인터넷 익스플로러, 파이어폭스, 크롬, 사파리 또는 오페라와 같은 특정 브라우저를 사용자가 선택할 옵션을 포함할 수도 있다. 구성된 DOM은 브라우저(318)에 의해 표시된다. 일실시예에서, 브라우저(318)는 W3C 규격 브라우저이다. 도 3에 도시된 실시예에서, 브라우저(318)는 마크업 텍스트(302)에 의해 정의된 텍스트 "Hello"를 포함하는 DOM 요소를 디스플레이한다.
뷰 노드 트리 및 문서 노드 트리(310)는 브라우저(318) 내의 DOM 요소를 마크업 텍스트(302)에 링크시킨다. 예를 들어, 브라우저(318) 내에서 "Hello"를 선택하거나 강조함으로써, 마크업 텍스트(302) 내의 관련 마크업 텍스트가 선택되거나 강조된다. 역으로, 마크업 텍스트(302) 내에서 "<p>Hello</p>"를 선택하거나 강조함으로써, 브라우저 내의 관련 DOM 요소가 선택되거나 강조된다.
DOM 수정 리스너(322)는 브라우저(318) 내에 DOM 변형(mutation)과 같은 DOM 요소에 대한 변경을 추적한다. 일실시예에서, DOM 수정 리스너(322)는 DOM 요소에 대한 런타임 수정사항을 추적하여 문서 노드 트리(310) 내 텍스트 오프셋을 무효(invalid)로 마킹하거나 또는 문서 노드 트리(310) 내 텍스트 오프셋을 DOM 요소 및/또는 속성을 생성하고/또는 겹쳐쓰기하는 것의 원인이 되는 JS의 실행 위치로 대체한다. 일실시예에서, DOM 수정 리스너(322)는 API(106) 및/또는 스크립트(108)(도 1 참고)로 인한 DOM 요소에 대한 변경사항을 추적한다. 일실시예에서, DOM 수정 리스너(322)는 DOM 요소에 대한 수정의 원인이 되는 스크립트의 라인을 나타내기 위해 수정된 DOM 요소와 연관된 문서 노드 트리의 노드를 업데이트하거나 또는 삽입한다.
도 4는 문서 노드 트리(404)에 맵핑된 HTML 텍스트(402)의 일례(400)를 도시한 블록도이다. HTML 텍스트(402)로부터 문서 노드 트리(404)를 구성하기 위하여, HTML 텍스트(402)는 도 3과 관련하고 전술한 마크업 파서(306)와 같은 마크업 텍스트 파서에 의해 파싱된다. 도 4에 도시된 예에서, HTML 텍스트(402)는 문서 노드 트리(404)가 부모 노드 "DIV" 및 자식 노드 "SPAN" 및 "P"를 포함하도록 파싱된다. 자식 노드 "SPAN"은 자식 노드 "TEXT(Hello)"를 더 포함한다. 자식 노드 "P"는 자식 노드 "TEXT(World)" 및 "foo"의 값을 갖는 속성 "class"를 더 포함한다.
따라서, 문서 노드 트리(404)는 HTML 텍스트(402) 소스 문서 세부사항을 구조화된 트리 포맷으로 유지한다. 도 3과 관련하여 이미 설명한 바와 같이, 문서 노드 트리(404)는 또한 각각의 부모 및 자식 노드와 연관된 HTML 텍스트(402) 내에 HTML 텍스트의 특정 위치를 나타내기 위해 각 부모 노드 및 자식 노드에 대한 텍스트 오프셋을 각각 포함한다.
도 5는 뷰 노드 트리(508)에 맵핑된 문서 노드 트리(506)의 일례(500)를 도시한 블록도이다. 문서 노드 트리(506)는 마크업 문서(502)에 대한 소스 문서 세부사항을 구조화된 트리 포맷으로 제공한다. 뷰 노드 트리(508)는 HTML 인스턴스 관리자(504) 내의 DOM의 하나의 인스턴스를 나타낸다. 일실시예에서, HTML 인스턴스 관리자(504)는 뷰 노드 트리의 복수의 인스턴스를 관리할 수 있다. 일실시예에서, HTML 인스턴스 관리자(504) 내의 DOM을 나타내는 뷰 노드 트리(508)는 선택된 브라우저에 기초한다. HTML 인스턴스 관리자(504)는 뷰 노드 트리(508)가 기초하는 인터넷 익스플로러, 파이어폭스, 크롬, 사파리 또는 오페라와 같은 특정 브라우저를 사용자가 선택하는 옵션을 포함할 수 있다.
뷰 노드 트리(508)의 각각의 노드는 각 노드를 문서 노드 트리(506) 내의 관련 노드에 맵핑시키는 식별자를 포함한다. 일실시예에서, 식별자는 도 3과 관련하여 이전에 기술한 DOM 빌더(314)에 의해 뷰 노드 트리의 각 노드에 할당된다. 일실시예에서, 식별자는 숫자이다. 도 5에 도시된 예에서, 뷰 노드 트리(508)의 식별자 "105"는 문서 노드 트리(506)의 부모 노드 "DIV"에 맵핑된다. 마찬가지로, "식별자 "106"는 자식 노드 "SPAN"에 맵핑되고 식별자 "107"은 자식 노드 "TEXT(Hello)"에 맵핑된다. 따라서, 뷰 노드 트리의 각 식별자는 뷰 노드 트리의 노드를 문서 노드 트리 내 관련 노드에 링크한다.
도 6은 브라우저 인스턴스(614)로 표시된 DOM에 대한 뷰 노드 트리(610)의 일례(600)를 도시한 블록도이다. 애플리케이션(602)은 뷰 노드 트리(610)를 관리하는 HTML 인스턴스 관리자(608)를 포함한다. 일실시예에서, HTML 인스턴스 관리자(608)는 뷰 노드 트리의 복수의 인스턴스를 관리한다. 애플리케이션(606)은 브라우저 인스턴스(614)를 관리하는 인스턴스 관리자(612)를 포함한다. 일실시예에서, 인스턴스 관리자(612)는 복수의 브라우저 인스턴스를 관리한다. 브라우저 인스턴스(614)는 DOM의 인스턴스를 나타낸다. 애플리케이션(602)은 통신 링크(COM)(604)를 통해 애플리케이션(606)에 통신가능하게 결합된다.
뷰 노드 트리(610)의 각 노드의 식별자는 브라우저 인스턴스(614)에 의해 표시된 관련 DOM 요소에 링크되는데, 이는 뷰 노드 트리(610) 내에 "DOM Proxy"로 표시되어 있다. 따라서, 브라우저 인스턴스(614)에 의해 표시된 각 DOM 요소는 뷰 노드 트리(610)의 노드에 링크되거나 맵핑된다. 그러므로, 브라우저 인스턴스(614)에서 표시된 각 DOM 요소는 뷰 노드 트리 및 문서 노드 트리를 통해 마크업 텍스트 소스 문서 내의 마크업 텍스트에 링크된다.
도 6에 도시된 실시예에서, 뷰 노드 트리(610)의 식별자 "105"는 브라우저 인스턴스(614)에 의해 표시된 DOM 요소의 식별자 "105"에 대한 DOM 프록시에 링크된다. 마찬가지로, 식별자 "106"은 식별자 "106"에 대한 DOM 프록시에 링크되고, 식별자 "107"은 식별자 "107"에 대한 DOM 프록시에 링크된다. 이 예에서, 뷰 노드 트리(610)는 자식 노드 "TEXT(Hello)"(도 5 참고)를 브라우저 인스턴스(614) 내의 DOM 요소 "Hello"에 링크시키는 식별자 "107"를 포함한다.
도 7은 소스 코드 편집기 내의 마크업 텍스트를 브라우저 내의 관련 DOM 요소와 링크시키는 방법(702)의 일실시예를 도시한 순서도이다. 704에서, 소스 코드 편집기에서 마크업 텍스트 소스 문서(예컨대, 도 3과 관련하여 앞서 기술된 마크업 텍스트(302))가 열린다. 706에서, 마크업 텍스트 소스 문서에 맵핑된 문서 노드 트리(예컨대, 도 3과 관련하여 앞서 설명된 문서 노드 트리(310))가 구성된다. 708에서, DOM 및 문서 노드 트리에 맵핑된 DOM을 나타내는 뷰 노드 트리(예컨대, 도 5와 관련하여 앞서 기술된 뷰 노트 트리)가 구성된다.
710에서, DOM이 브라우저에 표시된다(예컨대, 도 1과 관련하여 앞서 기술된 실행 표시(104)). 712에서, 브라우저에서의 DOM 요소의 선택은 소스 코드 편집기 내의 관련 마크업 텍스트에 링크되거나 또는 소스 코드 편집기 내의 마크업 텍스트의 선택이 브라우저 내의 관련 DOM 요소에 링크된다. DOM 요소와 관련 마크업 텍스트 사이의 링크는 뷰 노드 트리 및 문서 노드 트리를 통해 제공된다.
도 8은 문서 노드 트리의 노드의 텍스트 오프셋을 업데이트하거나 무효화하는 방법(800)의 일실시예를 도시한 순서도이다. 802에서, DOM의 실행 표시에 대한 수정사항이 추적된다. DOM의 실행 표시에 대한 수정사항은 API(106), 스크립트(108)(도 1 참고) 또는 다른 적절한 프로세스에 기인할 수 있다. 804에서, 문서 노드 트리 내의 노드의 텍스트 오프셋은 DOM의 실행 표시에 대한 수정에 기초하여 업데이트되거나 무효화된다. 일실시예에서, DOM의 실행 표시에 대한 수정사항과 연관된 문서 노드 트리 내의 대응하는 노드의 텍스트 오프셋은 수정 사항의 원인이 되는 JS의 위치를 나타내도록 업데이트된다.
실시예들은 DOM 요소를 구성하는데 사용된 마크업 텍스트 소스 문서 내의 마크업 텍스트를 갖는 브라우저에서 표시된 DOM 요소들을 링크시키기 위한 웹 개발 툴을 제공한다. 마크업 텍스트 소스 문서는 오리지널 소스 코드와 구성된 DOM 요소 사이에 정확한 맵핑이 유지되도록 DOM을 하나씩 구성하도록 파싱된다. 상술한 웹 개발 툴을 사용하면, 웹 페이지 개발자는 실행 페이지에서 선택된 DOM 요소와 연관된 소스 코드를 바로 찾아낼 수 있고 선택된 소스 코드와 연관된 실행 페이지에서 DOM 요소를 바로 찾아낼 수 있다.
본명세서에서 특정 실시예를 도시하고 설명하였지만, 다양한 다른 및/또는 균등한 구현예들이 본 발명의 범주로부터 벗어나지 않으면서 도시되고 상술된 특정 실시예들을 대체할 수도 있음을 당업자들은 이해할 수 있을 것이다. 본 출원은 본 명세서에서 논의한 특정 실시예의 어떠한 변형들도 커버하고자 한다. 따라서, 본 발명은 청구범위 및 균등물에 의해서만 제한됨에 유의하라.

Claims (20)

  1. 웹 개발 툴 내에서, 복수의 브라우저 중에서 DOM(Document Object Model)의 구성의 기초가 될 브라우저를 선택하는 단계와,
    오리지널 소스 코드를 포함하는 텍스트 소스 문서를 파싱하기 전에 소스 코드 편집기에서 여는 단계와,
    문서 노드 트리가 상기 문서 노드 트리의 각각의 노드에 대한 텍스트 오프셋을 포함하도록 상기 텍스트 소스 문서를 파싱하여 상기 문서 노드 트리를 구성하는 단계 - 각각의 노드에 대한 각각의 텍스트 오프셋은 상기 문서 노드 트리의 상기 노드에 대응하는 상기 텍스트 소스 문서 내의 연관 오리지널 소스 코드의 위치를 나타냄 - 와,
    상기 문서 노드 트리로부터 상기 선택된 브라우저에 기초한 DOM 및 상기 DOM을 나타내는 뷰 노드(view node) 트리를 구성하는 단계 - 상기 뷰 노드 트리를 구성하는 단계는 상기 뷰 노드 트리를 상기 문서 노드 트리에 맵핑하는 단계를 포함함 - 와,
    각각의 DOM 요소(element)가 상기 DOM 요소에 대응하는 상기 연관 오리지널 소스 코드에 링크되도록, 상기 DOM의 실행 표시(running representation)를 제공하는 단계를 포함하되,
    상기 문서 노드 트리의 각각의 노드에 대한 상기 텍스트 오프셋은 라인 번호 및 라인 내의 위치 또는 상기 텍스트 소스 문서의 시작 지점에 대한 문자의 위치를 나타내는 문자 번호를 포함하고,
    상기 DOM의 실행 표시 내의 DOM 요소를 선택함으로써, 상기 선택된 DOM 요소와 연관된 상기 텍스트 소스 문서의 오리지널 소스 코드가 상기 소스 코드 편집기 내에서 선택되는
    방법.
  2. 제1항에 있어서,
    상기 DOM의 실행 표시 내의 DOM 요소에 대한 수정사항(modification)을 추적하는 단계와,
    상기 수정된 DOM 요소에 대응하는 상기 뷰 노드 트리의 상기 노드에 대한 텍스트 오프셋을 상기 수정사항에 기초하여 무효(invalid)로서 마킹하는 단계 및 상기 수정된 DOM 요소에 대응하는 뷰 노드 트리의 상기 노드에 대한 텍스트 오프셋을 상기 수정사항에 기초하여 업데이트된 텍스트 오프셋으로 대체하는 단계 중 하나의 단계
    를 더 포함하는 방법.
  3. 제2항에 있어서,
    상기 수정사항을 추적하는 단계는 DOM 변형(mutation) 이벤트를 추적하는 단계를 포함하는
    방법.
  4. 제2항에 있어서,
    상기 수정사항을 추적하는 단계는 상기 DOM의 실행 표시의 API를 통한 수정사항을 추적하는 단계를 포함하는
    방법.
  5. 제1항에 있어서,
    상기 DOM의 실행 표시 내의 스크립트의 실행으로 인한 DOM 요소에 대한 수정사항을 추적하는 단계와,
    상기 DOM 요소에 대한 수정사항에 대한 원인이 되는 스크립트의 라인을 나타내기 위해 상기 수정된 DOM 요소와 연관된 상기 문서 노드 트리의 노드를 업데이트하는 단계 및 삽입하는 단계 중 하나의 단계
    를 더 포함하는 방법.
  6. 제1항에 있어서,
    상기 DOM의 실행 표시를 제공하는 단계는 상기 DOM의 실행 표시를 브라우저 인스턴스로 제공하는 단계를 포함하는
    방법.
  7. 제1항에 있어서,
    상기 텍스트 소스 문서를 파싱하는 단계는 HTML(HyperText Markup Language) 파서 및 CSS(Cascading Style Sheets) 파서 중 하나로 상기 텍스트 소스 문서를 파싱하는 단계를 포함하는
    방법.
  8. 제1항에 있어서,
    상기 텍스트 소스 문서를 파싱하는 단계는 상기 선택된 브라우저의 파서에 기초하여 상기 텍스트 소스 문서를 파싱하는 단계를 포함하는
    방법.
  9. 제1항에 있어서,
    상기 텍스트 소스 문서의 일부를 선택하는 것에 응답하여, 상기 텍스트 소스 문서의 상기 선택된 일부와 연관된 DOM 요소를 상기 DOM의 실행 표시에서 선택하는
    방법.
  10. 제1항에 있어서,
    상기 DOM의 실행 표시에 대한 수정사항으로 인해 상기 DOM의 실행 표시 내에서 더이상 표시되지 않는 상기 텍스트 소스 문서의 일부를 나타내는 단계
    를 더 포함하는 방법.
  11. 제1항에 있어서,
    DOM 요소를 선택하는 것에 응답하여, 상기 DOM 요소와 연관된 텍스트 오프셋이 보고되는
    방법.
  12. 방법을 수행하도록 컴퓨팅 장치를 제어하는 컴퓨터 실행가능 명령어를 저장하는 컴퓨터 판독가능 저장 매체로서,
    상기 방법은
    웹 개발 툴 내에서, 복수의 브라우저 중에서 DOM(Document Object Model)의 구성의 기초가 될 브라우저를 선택하는 단계와,
    오리지널 소스 코드를 포함하는 마크업 텍스트 소스 문서를 파싱하기 전에 소스 코드 편집기에서 여는 단계와,
    문서 노드 트리의 각각의 노드가 텍스트 오프셋 및 마크업 텍스트 소스 문서 세부사항을 포함하도록 상기 마크업 텍스트 소스 문서로부터 상기 문서 노드 트리를 구성하는 단계 - 상기 문서 노드 트리의 각각의 노드 내의 상기 텍스트 오프셋은 상기 문서 노드 트리의 상기 노드에 대응하는 상기 마크업 텍스트 소스 문서 내의 연관 오리지널 소스 코드의 위치를 나타냄 - 와,
    상기 문서 노드 트리로부터 상기 선택된 브라우저에 기초한 DOM 및 상기 DOM을 나타내는 뷰 노드(view node) 트리를 구성하는 단계 - 상기 뷰 노드 트리를 구성하는 단계는 상기 뷰 노드 트리를 상기 문서 노드 트리에 맵핑하는 단계를 포함함 - 와,
    각각의 DOM 요소(element)가 상기 DOM 요소에 연관된 상기 연관 오리지널 소스 코드에 링크되도록, 상기 브라우저에서 상기 DOM을 표시하는 단계 - 상기 링크는 상기 뷰 노드 트리 및 상기 문서 노드 트리 내의 상기 텍스트 오프셋을 통해 제공됨 - 를 포함하되,
    상기 문서 노드 트리의 각각의 노드에 대한 상기 텍스트 오프셋은 라인 번호 및 라인 내의 위치 또는 상기 마크업 텍스트 소스 문서의 시작 지점에 대한 문자의 위치를 나타내는 문자 번호를 포함하고,
    상기 브라우저에서 상기 DOM 요소를 강조함으로써, 상기 강조된 DOM 요소와 연관된 상기 마크업 텍스트 소스 문서의 오리지널 소스 코드가 상기 소스 코드 편집기 내에서 강조되는
    컴퓨터 판독가능 저장 매체.
  13. 제12항에 있어서,
    상기 소스 코드 편집기에서 마크업 텍스트를 강조함으로써, 상기 강조된 마크업 텍스트와 연관된 DOM 요소가 상기 브라우저 내에서 강조되는
    컴퓨터 판독가능 저장 매체.
  14. 제12항에 있어서,
    상기 문서 노드 트리를 구성하는 단계는, HTML(HyperText Markup Language) 파서 및 CSS(Cascading Style Sheets) 파서를 포함하는 마크업 텍스트 파서를 통해 상기 마크업 텍스트 소스 문서를 점진적으로 파싱하는 단계를 포함하는
    컴퓨터 판독가능 저장 매체.
  15. 제12항에 있어서,
    상기 뷰 노드 트리를 상기 문서 노드 트리에 맵핑하는 단계는 상기 뷰 노드 트리 내의 각각의 노드에 대해 식별자를 할당하는 단계 - 상기 뷰 노드 트리의 각각의 식별자는 상기 문서 노드 트리 내의 대응 노드에 맵핑됨 - 를 포함하는
    컴퓨터 판독가능 저장 매체.
  16. 컴퓨팅 장치를 제어하는 컴퓨터 실행가능 명령어를 포함하는 개발 툴을 저장하는 컴퓨터 판독가능 저장 매체로서,
    상기 개발 툴은 방법을 수행하도록 구성되고,
    상기 방법은
    오리지널 소스 코드를 포함하는 마크업 텍스트 소스 문서를 파싱하기 전에 편집하기 위한 소스 코드 편집기를 제공하는 단계와,
    상기 개발 툴 내에서, 복수의 브라우저 중에서 DOM(Document Object Model)의 구성의 기초가 될 브라우저를 선택하는 단계와,
    문서 노드 트리의 각각의 노드가 텍스트 오프셋 및 소스 문서 세부사항을 포함하도록 마크업 텍스트 파서를 통해 상기 마크업 텍스트 소스 문서로부터 상기 문서 노드 트리를 구성하는 단계 - 상기 문서 노드 트리의 각각의 노드 내의 상기 텍스트 오프셋은 상기 문서 노드 트리의 상기 노드에 대응하는 상기 마크업 텍스트 소스 문서 내의 연관 오리지널 소스 코드의 위치를 나타냄 - 와,
    상기 문서 노드 트리로부터 상기 선택된 브라우저에 기초한 DOM 및 상기 DOM을 나타내는 뷰 노드(view node) 트리를 구성하는 단계 - 상기 뷰 노드 트리는, 상기 브라우저에서 DOM 요소를 선택함으로써 상기 선택된 DOM 요소와 연관된 상기 마크업 텍스트 소스 문서의 오리지널 소스 코드가 상기 소스 코드 편집기 내에서 선택되도록, 그리고 상기 소스 코드 편집기에서 오리지널 소스 코드를 선택함으로써 상기 선택된 오리지널 소스 코드와 연관된 DOM 요소가 상기 브라우저 내에서 선택되도록, 상기 문서 노드 트리와 맵핑됨 - 를 포함하되,
    상기 문서 노드 트리의 각각의 노드에 대한 상기 텍스트 오프셋은 라인 번호 및 라인 내의 위치 또는 상기 마크업 텍스트 소스 문서의 시작 지점에 대한 문자의 위치를 나타내는 문자 번호를 포함하는
    컴퓨터 판독가능 저장 매체.
  17. 제16항에 있어서,
    상기 마크업 텍스트 파서는 HTML(HyperText Markup Language) 파서 및 CSS(Cascading Style Sheets) 파서를 포함하는
    컴퓨터 판독가능 저장 매체.
  18. 제16항에 있어서,
    상기 뷰 노드 트리는 상기 뷰 노드 트리 내의 각각의 노드에 대해 식별자를 할당함으로써 상기 문서 노드 트리에 맵핑되고, 상기 뷰 노드 트리의 각각의 식별자는 상기 문서 노드 트리 내의 대응 노드에 맵핑되는
    컴퓨터 판독가능 저장 매체.
  19. 제16항에 있어서,
    상기 소스 코드 편집기를 제공하는 단계는 마크업 텍스트 소스 문서의 복수의 인스턴스를 편집하도록 구성된 소스 코드 편집기를 제공하는 단계를 포함하고,
    상기 브라우저는 DOM의 복수의 인스턴스의 표현을 제공하도록 구성되는
    컴퓨터 판독가능 저장 매체.
  20. 제1항에 있어서,
    상기 소스 코드 편집기 내에서 상기 텍스트 소스 문서를 편집하는 단계와,
    상기 편집된 텍스트 소스 문서를 저장하는 단계
    를 더 포함하는 방법.
KR1020137033973A 2011-06-23 2012-05-30 소스 코드를 실행 요소에 링크시키는 기법 KR101975616B1 (ko)

Applications Claiming Priority (3)

Application Number Priority Date Filing Date Title
US13/167,229 US10540416B2 (en) 2011-06-23 2011-06-23 Linking source code to running element
US13/167,229 2011-06-23
PCT/US2012/039958 WO2013103374A2 (en) 2011-06-23 2012-05-30 Linking source code to running element

Publications (2)

Publication Number Publication Date
KR20140038469A KR20140038469A (ko) 2014-03-28
KR101975616B1 true KR101975616B1 (ko) 2019-05-07

Family

ID=47363026

Family Applications (1)

Application Number Title Priority Date Filing Date
KR1020137033973A KR101975616B1 (ko) 2011-06-23 2012-05-30 소스 코드를 실행 요소에 링크시키는 기법

Country Status (6)

Country Link
US (1) US10540416B2 (ko)
EP (1) EP2724254A4 (ko)
JP (1) JP5941539B2 (ko)
KR (1) KR101975616B1 (ko)
CN (1) CN103620586B (ko)
WO (1) WO2013103374A2 (ko)

Families Citing this family (13)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US10534830B2 (en) 2011-06-23 2020-01-14 Microsoft Technology Licensing, Llc Dynamically updating a running page
US10540416B2 (en) 2011-06-23 2020-01-21 Microsoft Technology Licensing, Llc Linking source code to running element
US9106690B1 (en) * 2012-06-14 2015-08-11 Bromium, Inc. Securing an endpoint by proxying document object models and windows
US20150310125A1 (en) * 2014-04-29 2015-10-29 Barak KINARTI Dynamic Custom Style Sheet Isolation
US11194885B1 (en) * 2015-07-07 2021-12-07 Google Llc Incremental document object model updating
CN106484759B (zh) * 2016-08-09 2020-01-10 广州视睿电子科技有限公司 交互式电子白板存储文件的解析方法和装置
US10997362B2 (en) * 2016-09-01 2021-05-04 Wacom Co., Ltd. Method and system for input areas in documents for handwriting devices
CN107632831B (zh) * 2017-09-22 2020-07-31 厦门集微科技有限公司 快速规范前端代码的方法及装置
KR102000542B1 (ko) * 2017-11-09 2019-07-16 주식회사 한글과컴퓨터 페이지 변경 편집 명령에 기초하여 돔 객체들을 편집하는 웹 문서 편집 장치 및 이의 동작 방법
KR102091420B1 (ko) * 2018-05-11 2020-03-20 니덱모빌리티코리아 주식회사 비언어 요구사항 정보에 대한 소스코드 추적이 가능한 시스템 및 방법
CN110347416B (zh) * 2019-07-19 2023-09-26 网易(杭州)网络有限公司 脚本的更新方法和装置
US20220414316A1 (en) * 2021-06-23 2022-12-29 International Business Machines Corporation Automated language assessment for web applications using natural language processing
CN114329265A (zh) * 2021-12-29 2022-04-12 中国人民解放军国防科技大学 一种自动采集网络资源的方法

Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20070266050A1 (en) * 2003-11-07 2007-11-15 Backbase B.V. Method, Device and System for Extending a Mark-Up Language
US20080270345A1 (en) * 2007-04-27 2008-10-30 Jeff Barlow System and method for using indexes to parse static XML documents

Family Cites Families (38)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US5524190A (en) 1993-06-04 1996-06-04 Taligent, Inc. Command object logging system for restoring documents
US6981211B1 (en) 1999-09-30 2005-12-27 International Business Machines Corporation Method for processing a document object model (DOM) tree using a tagbean
US7207000B1 (en) * 2000-02-24 2007-04-17 International Business Machines Corporation Providing dynamic web pages by separating scripts and HTML code
US6961750B1 (en) 2000-05-18 2005-11-01 Microsoft Corp. Server-side control objects for processing client-side user interface elements
US7047318B1 (en) 2001-04-20 2006-05-16 Softface, Inc. Method and apparatus for creating and deploying web sites with dynamic content
US7111234B2 (en) 2001-05-02 2006-09-19 Microsoft Corporation System and method for in-line editing of web-based documents
US6745208B2 (en) 2001-05-31 2004-06-01 International Business Machines Corporation Method and apparatus for synchronizing an XML document with its object model
US8555261B1 (en) 2001-06-28 2013-10-08 Microsoft Corporation Object-oriented pull model XML parser
WO2003056449A2 (en) 2001-12-21 2003-07-10 Xmlcities, Inc. Extensible stylesheet designs using meta-tag and/or associated meta-tag information
US7316003B1 (en) 2002-12-18 2008-01-01 Oracle International Corp. System and method for developing a dynamic web page
US7096422B2 (en) 2003-02-28 2006-08-22 Microsoft Corporation Markup language visual mapping
US7877399B2 (en) 2003-08-15 2011-01-25 International Business Machines Corporation Method, system, and computer program product for comparing two computer files
WO2005043410A2 (en) 2003-10-31 2005-05-12 Access Co., Ltd. Method, program and device for rendering web page
US7456840B2 (en) 2004-08-31 2008-11-25 Oracle International Corporation Displaying information using nodes in a graph
JP4686177B2 (ja) 2004-12-02 2011-05-18 インターナショナル・ビジネス・マシーンズ・コーポレーション Webページ・オーサリング装置、Webページ・オーサリング方法及びプログラム
EP1910920A4 (en) 2005-06-27 2011-03-09 Quipoz Pty Ltd CODE TRANSFORMATION
US7975020B1 (en) 2005-07-15 2011-07-05 Amazon Technologies, Inc. Dynamic updating of rendered web pages with supplemental content
US7930630B2 (en) 2006-05-31 2011-04-19 Microsoft Corporation Event-based parser for markup language file
CN100444174C (zh) 2006-09-25 2008-12-17 北京中搜在线软件有限公司 网页微内容提取、聚合和自动更新系统的方法
US20080082911A1 (en) 2006-10-03 2008-04-03 Adobe Systems Incorporated Environment-Constrained Dynamic Page Layout
CN101165685A (zh) 2006-10-19 2008-04-23 国际商业机器公司 用于生成动态网页的方法及装置
US7895514B1 (en) 2006-10-23 2011-02-22 Adobe Systems Incorporated Systems and methods for solving rendering compatibility problems across electronic document viewers
US8020094B2 (en) 2006-12-06 2011-09-13 Microsoft Corporation Editing web pages via a web browser
KR100958786B1 (ko) 2007-10-08 2010-05-18 엔에이치엔(주) 웹문서 편집 방법 및 장치
US8234564B2 (en) 2008-03-04 2012-07-31 Apple Inc. Transforms and animations of web-based content
US20090228838A1 (en) 2008-03-04 2009-09-10 Ryan Christopher N Content design tool
CN101685447A (zh) 2008-09-28 2010-03-31 国际商业机器公司 在Web页面片段剪切和混搭中处理CSS的方法和系统
CN101587488B (zh) 2009-05-25 2011-04-06 深圳市腾讯计算机系统有限公司 一种搜索引擎中页面重定向的检测方法及装置
US8332763B2 (en) 2009-06-09 2012-12-11 Microsoft Corporation Aggregating dynamic visual content
US8438312B2 (en) 2009-10-23 2013-05-07 Moov Corporation Dynamically rehosting web content
CN101763432A (zh) 2010-01-05 2010-06-30 北京大学 一种轻量级网页动态视图快速构建方法
US20110197124A1 (en) 2010-02-05 2011-08-11 Bryan Eli Garaventa Automatic Creation And Management Of Dynamic Content
CN101819596B (zh) 2010-04-28 2011-11-02 烽火通信科技股份有限公司 一种基于内存的xml脚本缓存容器
CN101996252B (zh) 2010-11-17 2013-01-16 浙江省电力公司电力科学研究院 一种解析xml文件时对节点元素的处理方法
CN102033954B (zh) 2010-12-24 2012-10-17 东北大学 关系数据库中可扩展标记语言文档全文检索查询索引方法
US10540416B2 (en) 2011-06-23 2020-01-21 Microsoft Technology Licensing, Llc Linking source code to running element
US10534830B2 (en) 2011-06-23 2020-01-14 Microsoft Technology Licensing, Llc Dynamically updating a running page
US20130227397A1 (en) 2012-02-24 2013-08-29 Microsoft Corporation Forming an instrumented text source document for generating a live web page

Patent Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20070266050A1 (en) * 2003-11-07 2007-11-15 Backbase B.V. Method, Device and System for Extending a Mark-Up Language
US20080270345A1 (en) * 2007-04-27 2008-10-30 Jeff Barlow System and method for using indexes to parse static XML documents

Also Published As

Publication number Publication date
US20120331374A1 (en) 2012-12-27
JP2014523576A (ja) 2014-09-11
WO2013103374A3 (en) 2013-10-24
WO2013103374A2 (en) 2013-07-11
CN103620586A (zh) 2014-03-05
KR20140038469A (ko) 2014-03-28
US10540416B2 (en) 2020-01-21
CN103620586B (zh) 2017-03-08
JP5941539B2 (ja) 2016-06-29
EP2724254A2 (en) 2014-04-30
EP2724254A4 (en) 2015-02-25

Similar Documents

Publication Publication Date Title
KR101975616B1 (ko) 소스 코드를 실행 요소에 링크시키는 기법
US10534830B2 (en) Dynamically updating a running page
US20130227397A1 (en) Forming an instrumented text source document for generating a live web page
US20130227396A1 (en) Editing content of a primary document and related files
US20050038796A1 (en) Application data binding
US11194884B2 (en) Method for facilitating identification of navigation regions in a web page based on document object model analysis
EP1818835A1 (en) Document processing device, and document processing method
US20050132279A1 (en) Method and system for mapping tags to classes using namespaces
KR20040002736A (ko) Xml 문서의 검증 및 스키마 위반을 보고하기 위한시스템 및 방법
US20080010588A1 (en) Document Processing Device and Document Processing Method
US20080250311A1 (en) Document Processing Device, and Document Processing Method
US20080208790A1 (en) Document Processing Device, and Document Processing Method
US20080010587A1 (en) Document Processing Device and Document Processing Method
US20080005662A1 (en) Server Device and Name Space Issuing Method
US20080005085A1 (en) Server Device and Search Method
US20100077295A1 (en) Document processing device and document processing module
EP1821220A1 (en) Data processing device, document processing device, and document processing method
US20070273936A1 (en) Document Processing Device, And Document Processing Method
US20080262832A1 (en) Document Processing Device, and Document Processing Method
US7533335B1 (en) Representing fields in a markup language document
US20080005154A1 (en) Document Processing Device and Document Processing Method
WO2016149565A1 (en) Declarative cascade reordering for styles
US20090083620A1 (en) Document processing device and document processing method
US20080065979A1 (en) Document Processing Device, and Document Processing Method
JP2008257277A (ja) 文書処理装置、方法、及びプログラム

Legal Events

Date Code Title Description
N231 Notification of change of applicant
A201 Request for examination
E902 Notification of reason for refusal
E701 Decision to grant or registration of patent right
GRNT Written decision to grant