2017-09-14 3 views
0

Chrome Inspector> 요소 탭에서 특정 요소에 연결하는 것이 유용합니다. 예를 들어, 다음 HTML로 페이지를 주어진 :Chrome Inspector에서 특정 요소에 연결할 수 있나요?

<div> 
    <div id="box">A box element</div> 
</div> 

하는 것이 가능 크롬 경위> 요소 탭 내에서 #id 요소에 대한 링크를 작성하는 것입니다.

즉, URL에 대한 링크를 만들고 Chrome Inspector를 열고 #box 요소를 자동으로 선택하도록 할 수 있나요?

view-source:URL과 비슷한 URL을 통해 Chrome 개발 도구를 여는 방법이 있다면 요소의 XPath를 사용하여이 작업을 수행 할 수 있습니다.

+0

아마도 그렇지 않습니다. 그런 URL로 무엇을 할 계획입니까? (뷰 소스 URL로 무엇을 할 수 있다고 생각하십니까? 일반 웹 페이지에서는 링크 할 수 없습니다.) –

+0

다른 사람들과 교육용으로 디버깅 할 때 유용합니다. –

+1

FWIW devtools 콘솔에서'inspect ($ ('# id'))'를 입력 할 수도 있습니다 (페이지에 jQuery가있는 경우'inspect ($ ('# id') [0])'). 또한 누군가가 이미 devtools 용 확장 패널을 작성했거나 할 수 있습니다. :) – wOxxOm

답변

2

요소를 마우스 오른쪽 단추로 클릭하고 "복사 선택기"또는 "XPath 복사"를 선택할 수 있습니다. 요소 패널에서 Cmd-F를 누르면 "문자열, 선택기 또는 XPath로 찾기"와 함께 검색 막대가 표시되므로 특정 페이지의 특정 요소를 가리 키도록이 단추를 사용할 수 있습니다.

관련 문제