DOM 트리의 깊이에 상관없이 방화범이 끌린 모든 DOM 요소의 절대 좌표 (문서의 시작 부분에 상대적으로)를 가져와야합니다. 그런 플러그인이 있습니까?방화 광 - 절대 좌표 얻기
3
A
답변
3
실제로 플러그인이 필요하지는 않지만 일부 Firebug 내부에 대한 JavaScript + 지식 만 있습니다.
this article에서 DOM 요소의 절대 좌표를 얻는 방법을 찾을 수 있습니다. 각 DOM 요소에는 다른 DOM 요소 (offsetParent)에 관한 위치를 정의하는 속성 .offsetLeft .offsetTop .offsetParent
이 있습니다. 계층 구조 맨 위에있는 요소는 offsetParent = null
입니다. 엘리먼트와 그것의 offsetParents를 가로 지르면서 절대 좌표를 찾을 수있다. 해당 페이지에서 복사
코드 :
var findpos = function findPos(obj) {
var curleft = curtop = 0;
if (obj.offsetParent) {
do {
curleft += obj.offsetLeft;
curtop += obj.offsetTop;
} while (obj = obj.offsetParent);
return [curleft,curtop];
}
}
(방화범을 붙여 넣은 다음 콘솔에서 사용할 수있는 findpos
기능을 가지고).
대부분의 경우 가장 간단한 경우 오프셋 그림자가 0 인 offsetParent = <body>
이 있으므로 offsetLeft 및 offsetTop에 아무 것도 추가하지 않아도됩니다. 그러나 상대적인 위치 지정이 발생하면 부모를 지나쳐야합니다.
Firebug에서 요소를 선택하면 Firebug 콘솔에서 $0
으로 사용할 수 있습니다.
는 그래서, 두 가지를 혼합 한 후, 당신은 스크린 샷처럼 명령을 실행할 수 있습니다 :
쉽게 모든 요소의 절대 좌표를 얻을 수 있습니다.
위 스크립트를 붙여 넣은 스크립트는 대부분 대다수에서 작동합니다. 좀 더 견고한 기능을 위해서도 this post을 읽어 볼 수 있습니다.
관련 문제
- 1. 방화 광 : 방화 광 콘솔에서 POST 데이터를 보내는 방법은 무엇입니까?
- 2. 방화 광 디버깅 문제
- 3. 방화 광 콘솔
- 4. 방화 광 프로필
- 5. 방화 광 디버깅 JavaScript
- 6. 방화 광 및 성능 문제?
- 7. 방화 광 그물 대기 시간
- 8. Firefox 6의 Dojo 방화 광
- 9. 방화 광 명령 줄 기록
- 10. 방화 광 프로그램 중단 점?
- 11. 방화 광 디버거가 작동하지 않습니다.
- 12. 방화 광 문제 - "this.Z.isActive가 기능이 아닙니다."
- 13. FF 3.5, 방화 광 "sifR3을 깨뜨림
- 14. 자바 스크립트에서 방화 광 콘솔을 읽는 중
- 15. 방화 광 및 jQuery에 대한 약간의 도움!
- 16. iFrame의 방화 광 및 jQuery 선택기
- 17. 방화 광 : 개체의 연결된 이벤트를 보는 방법?
- 18. 방화 광 명령 편집기 사용 안 함
- 19. 방화 광 출력 저장 또는 인쇄
- 20. 방화 광 - 특정 .css 파일의 스타일 숨기기
- 21. SVG 절대 좌표?
- 22. WinRT의 UIElement의 절대 좌표
- 23. AS3의 절대 좌표
- 24. 존재하지 않는 중단 점에서 방화 광 디버그가 점프/중단됩니다!
- 25. 방화 광 - 노드의 들여 쓰기를 줄이는 방법은 무엇입니까?
- 26. AngularJS : 방화 광 및 사용자 세션에서 아약스 데이터 숨기기
- 27. 변경 값에서 방화 광 특수한 기능으로부터 데이터 보호
- 28. 방화 광 단추를 사용하면 js 오류가 어디에 표시됩니까?
- 29. 방화 광 명령에서 div id를 선택하는 방법은 무엇입니까?
- 30. 이상한 500 내부 서버 오류 (방화 광, PHP, display_errors, ajax)