refactor(topics): 멀티 에이전트용 지식 재편 — _Common(공통 기본기) + Domain_* 구조

에이전트 8종(대화형/프로그래머 C·S/디자이너/설계자/기획자/QA/PD/PM)에게 [공통 기본 능력 + 롤별 Specialty] 2층으로 지식을 주입하기 위한 재분류. 문서 내용·포맷은 무수정, 폴더 이동만 (6,372개 문서 수 보존 확인). - Topic_Programming → Domain_Programming (내부 구조 보존) - Topic_Graphic → Domain_Design - Topic_Business → Domain_Product - Topic_General → Domain_General - _Common 신설: Math(구 Topic_Math_Specialty), Reasoning(구 General/From_Thinking & Reasoning), Reasoning_Creativity(구 General/From_창의성), Communication(Poetic_Blog_Writing + From_writing) - 타 도메인의 From_* 폴더는 유지 (출처 표기일 뿐, 이미 도메인에 맞게 분류된 문서) - 빈 폴더 정리 (memory/procedures) - 에이전트→폴더 매핑은 workspace의 .astra/agent-knowledge-map.json (9개 에이전트) Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-11 11:05:56 +09:00
parent 6549ead309
commit c24165b8bc
6193 changed files with 1717 additions and 31 deletions
@@ -0,0 +1,140 @@
+---
+id: javascript-html-events
+title: "JavaScript HTML Events"
+category: "Frontend"
+status: "draft"
+verification_status: "conceptual"
+canonical_id: ""
+aliases: ["HTML events", "onclick", "onload", "event handlers", "JavaScript events"]
+duplicate_of: ""
+source_trust_level: "B"
+confidence_score: 0.88
+created_at: 2026-06-23
+updated_at: 2026-06-23
+review_reason: ""
+merge_history: []
+tags: ["javascript", "js", "web", "frontend", "w3schools", "dom"]
+raw_sources: ["https://www.w3schools.com/js/js_events.asp"]
+applied_in: []
+github_commit: ""
+---
+
+# [[JavaScript HTML Events]]
+
+## 🎯 한 줄 통찰 (One-line insight)
+HTML events are things that happen to HTML elements, and JavaScript event handlers are the code that runs when those events occur. [S1]
+
+## 🧠 핵심 개념 (Core concepts)
+- **An event handler is code that runs on an event** — an event handler is JavaScript code that runs when an event happens. [S1]
+- **Events can call a function** — an event attribute can run JavaScript inline or call a named function. [S1]
+- **`this` refers to the element** — inside an inline handler, `this` refers to the element that received the event. [S1]
+- **addEventListener is the recommended approach** — attaching handlers with `addEventListener()` keeps JavaScript separate from the HTML markup. [S1]
+
+## 🧩 추출된 패턴 (Extracted patterns)
+- **Inline handler** — `onclick="..."` runs JavaScript directly in the HTML attribute. [S1]
+- **Function call handler** — `onclick="displayDate()"` delegates to a named function. [S1]
+- **Listener handler** — `element.addEventListener("click", fn)` attaches behavior from script. [S1]
+
+## 📖 세부 내용 (Details)
+**HTML Events** [S1]
+An HTML event can be something the browser does, or something a user does. JavaScript lets you execute code when events are detected. [S1]
+
+**JavaScript Events / Calling a JavaScript Function** [S1]
+A basic `onclick` handler running JavaScript inline: [S1]
+```html
+<button onclick="document.getElementById('demo').innerHTML = Date()">
+  The time is?
+</button>
+```
+Using `this` to refer to the element itself: [S1]
+```html
+<button onclick="this.innerHTML = Date()">The time is?</button>
+```
+Calling a named function from the handler: [S1]
+```html
+<button onclick="displayDate()">The time is?</button>
+
+<script>
+function displayDate() {
+  document.getElementById("demo").innerHTML = Date();
+}
+</script>
+```
+
+**Common HTML Events** [S1]
+
+| Event | Description |
+|-------|-------------|
+| `onchange` | An HTML element has been changed |
+| `onclick` | The user clicks an HTML element |
+| `onmouseover` | The user moves the mouse over an HTML element |
+| `onmouseout` | The user moves the mouse away from an HTML element |
+| `onkeydown` | The user pushes a keyboard key |
+| `onload` | The browser has finished loading the page |
+
+**JavaScript Event Handlers** [S1]
+An event handler is JavaScript code that runs when an event happens. [S1]
+
+**Using an Event Listener** [S1]
+The recommended way to attach a handler from script is `addEventListener()`: [S1]
+```html
+<button id="myBtn">Click me</button>
+<p id="demo"></p>
+
+<script>
+const btn = document.getElementById("myBtn");
+btn.addEventListener("click", function () {
+  document.getElementById("demo").innerHTML = Date();
+});
+</script>
+```
+
+## 🛠️ 적용 사례 (Applied in summary)
+The page's snippets — `onclick` writing `Date()`, `this.innerHTML`, a `displayDate()` function, and an `addEventListener("click", ...)` handler — are the canonical applied examples. No external project/commit applications found in the source.
+
+## 💻 코드 패턴 (Code patterns)
+Inline handler (language: HTML):
+```html
+<button onclick="document.getElementById('demo').innerHTML = Date()">The time is?</button>
+```
+Function-call handler (language: HTML/JavaScript):
+```html
+<button onclick="displayDate()">The time is?</button>
+<script>
+function displayDate() {
+  document.getElementById("demo").innerHTML = Date();
+}
+</script>
+```
+Event listener (language: JavaScript):
+```javascript
+const btn = document.getElementById("myBtn");
+btn.addEventListener("click", function () {
+  document.getElementById("demo").innerHTML = Date();
+});
+```
+
+## ⚖️ 비교 및 선택 기준 (Comparison & decision criteria)
+- Use **inline `on*` attributes** for quick, simple handlers written directly in the HTML. [S1]
+- Use **`addEventListener()`** when you want the JavaScript separated from the HTML markup for better readability and to attach multiple handlers. [S1]
+
+## ⚖️ 모순 및 업데이트 (Contradictions & updates)
+No contradictions found in the source.
+
+## ✅ 검증 상태 및 신뢰도
+- **상태:** draft
+- **검증 단계:** conceptual (실제 적용 사례 발견 시 applied/validated로 승격 가능)
+- **출처 신뢰도:** B (W3Schools — widely used educational reference, not a primary standards body)
+- **신뢰 점수:** 0.88
+- **중복 검사 결과:** 신규 생성 (New discovery)
+
+## 🔗 지식 그래프 (Knowledge Graph)
+- **상위/루트:** [[JavaScript Tutorial]]
+- **관련 개념:** [[JavaScript DOM Event Listener]], [[JavaScript DOM Changing CSS]], [[JavaScript DOM Changing HTML]], [[JavaScript HTML DOM]]
+- **참조 맥락:** The event layer that triggers DOM content and style changes in response to user/browser actions.
+
+## 📚 출처 (Sources)
+- [S1] W3Schools — JavaScript HTML Events — https://www.w3schools.com/js/js_events.asp
+
+## 📝 변경 이력 (Change history)
+- 2026-06-23: Initial draft synthesized from the W3Schools "JavaScript HTML Events" page (Astra wiki-curation, P-Reinforce v3.1 format).