Chrome 개발자 도구 : 임시 이벤트 사용 안함

클릭하면 일부 DOM 조작을 수행하는 구성 요소가있는 복잡한 SPA가 있습니다.Chrome 개발자 도구 : 임시 이벤트 사용 안함

이벤트를 발생시키지 않고 (조작하기 전에 DOM을 확인하기 위해) 크롬 개발자 도구 (Ctrl + Shift + C 기본값)로이 구성 요소의 DOM을 검사하려면 어떻게해야합니까?

2016-05-31 Утка Учится Укрываться

개발자 콘솔의 오른쪽에는 더 많은 컨트롤이 있습니다. 원하는 DOM 요소를 클릭 한 다음 "Event Listeners"를 선택하여 요소의 이벤트 리스너에서 (수신기를 추가하지 않고) 빌드를 추적하거나 DOM 중단 점을 추가 할 수 있습니다 (요소를 마우스 오른쪽 단추로 클릭하고 중단 할시기 선택).)를 선택하고 DOM Breakpoints 옵션을 사용합니다 (오른쪽 메뉴에 있음). 도움이 되었으면 좋겠어요

출처

2016-05-31 12:29:04

나는 그것을 보았지만 3 가지를 깨닫지 못합니다. 1. 어떤 이벤트를 발생 시키려면 _ 요소를 선택해야합니까? ctrl + shift + c를 사용하지 않고 수동으로 dom에서 요소를 찾으려면 길고 복잡한 dom 구조가있을 때 까다 롭습니다. 2. 이벤트를 없애고 싶습니다. 작업하기 전에 일시적으로 중지하고 싶습니다. 3. _all_ 이벤트를 중지하고 싶습니다. 수동으로 1 by 1. 가능합니까? –

DOM 중단 점은 유용 할 수 있지만 DOM 조작뿐만 아니라 모든 핸들러 코드 실행을 막을 수 있습니까? 나는 dom breakpoints가 나를 위해 충분하다고 생각한다. 그러나 그것은 어쨌든 매우 안락하지 않다. –

1. 요소 관리자를 열고 Ctrl + F를 눌러 DOM 요소를 검색 한 다음 브라우저를 새로 고칩니다. 이것은 이벤트가 발생하기 전에 요소를 제공해야합니다. 2. 중단 점이 실행을 중지하므로 이상적으로 요소의 이벤트가 실행되기 전에 중단 점을 설정해야합니다. 3.'stopPropagation'과'preventDefault'가 당신에게 도움이 될 수 있는지 확인하십시오. –

Chrome 개발자 도구 : 임시 이벤트 사용 안함

답변

관련 문제