자동 완성: 저장된 주소 검사 및 디버그
컬렉션을 사용해 정리하기
내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요.
자동 완성 패널을 사용하여 Chrome에 저장된 주소 정보를 검사하고 디버그합니다.
개요
Chrome 자동 완성 을 사용하면 저장된 주소로 웹사이트의 양식이 자동으로 작성될 수 있는 편리한 방법을 제공합니다. DevTools의 자동 완성 패널을 사용하면 양식 필드, 예측된 자동 완성 값, 저장된 데이터 간의 매핑을 검사할 수 있습니다.
참고: 자동 완성 패널을 사용하면 주소 정보만 검사할 수 있습니다.
Chrome에 주소 정보 저장
기본적으로 Chrome은 웹 양식을 제출할 때 입력한 주소 정보를 저장하라는 메시지를 표시합니다.
이러한 메시지가 표시되지 않으면 Chrome 오른쪽 상단에서 more_vert Chrome 맞춤설정 및 제어 > 키 비밀번호 및 자동 완성 > location_on 주소 및 기타 로 이동한 다음 toggle_on 주소 저장 및 자동 입력 을 사용 설정합니다. 여기에서 새 주소를 추가 할 수도 있습니다.
자동 완성 패널 열기
기본적으로 DevTools가 열려 있고 웹사이트에서 양식을 자동 완성하면 자동 완성 패널이 자동으로 열립니다. 사용 중지하려면 패널을 수동으로 열고 check_box_outline_blank 이 패널 자동으로 열기 체크박스를 선택 해제합니다.
자동 완성 패널을 수동으로 열려면 다음 단계를 따르세요.
DevTools를 엽니다 .
다음을 눌러 명령어 메뉴 를 엽니다.
macOS: Command +Shift +P
Windows, Linux, ChromeOS: Control +Shift +P
autofill
을 입력하기 시작하고 자동 완성 표시 를 선택한 다음 Enter 를 누릅니다.
DevTools는 기본적으로 DevTools 창 하단에 있는 창 에서 패널을 엽니다. 상단으로 이동 할 수도 있습니다.
또는 다음과 같은 방법으로 자동 완성 패널을 열 수 있습니다.
상단의 작업 표시줄에서 double_arrow 패널 더보기 를 클릭하고 드롭다운 목록에서 자동 완성 을 선택합니다.
오른쪽 상단에서 more_vert DevTools 맞춤설정 및 제어 > 도구 더보기 > 자동 완성 을 선택합니다.
자동 완성 데이터 검사
자동 완성 데이터를 검사하려면 다음 안내를 따르세요.
Chrome에 자동 완성 이 사용 설정되어 있고 주소 정보가 저장되었는지 확인합니다.
예를 들어 이 데모 페이지 에서 DevTools를 엽니다 .
데모 페이지의 주소 웹 양식에서 양식 입력란에 포커스를 맞춥니다. Chrome에 데이터 자동 완성 옵션이 포함된 드롭다운 메뉴가 표시됩니다.
메뉴에서 옵션을 선택합니다. 자동 완성 은 저장된 데이터로 양식을 채우고 자동 열기가 사용 설정 된 경우 DevTools에서 자동 완성 패널을 엽니다. 그렇지 않으면 자동 완성 패널을 수동으로 엽니다.
데이터 및 데이터 매핑
자동 완성 패널에는 양식 입력란에 삽입된 데이터 및 다음 항목 간의 매핑이 포함된 표가 표시됩니다.
페이지에서 양식 필드 가 감지되었습니다.
예측 자동 완성 값 : 자동 완성 이 휴리스틱을 사용하여 결정합니다.
인식된 필드에 삽입한 자동 완성 값(있는 경우)입니다.
팁: 또한 Issues 패널을 사용하여 자동 완성 속성 문제를 찾고 수정 팁을 얻을 수 있습니다.
달리 명시되지 않는 한 이 페이지의 콘텐츠에는 Creative Commons Attribution 4.0 라이선스 에 따라 라이선스가 부여되며, 코드 샘플에는 Apache 2.0 라이선스 에 따라 라이선스가 부여됩니다. 자세한 내용은 Google Developers 사이트 정책 을 참조하세요. 자바는 Oracle 및/또는 Oracle 계열사의 등록 상표입니다.
최종 업데이트: 2024-04-16(UTC)
[{
"type": "thumb-down",
"id": "missingTheInformationINeed",
"label":"필요한 정보가 없음"
},{
"type": "thumb-down",
"id": "tooComplicatedTooManySteps",
"label":"너무 복잡함/단계 수가 너무 많음"
},{
"type": "thumb-down",
"id": "outOfDate",
"label":"오래됨"
},{
"type": "thumb-down",
"id": "translationIssue",
"label":"번역 문제"
},{
"type": "thumb-down",
"id": "samplesCodeIssue",
"label":"샘플/코드 문제"
},{
"type": "thumb-down",
"id": "otherDown",
"label":"기타"
}]
[{
"type": "thumb-up",
"id": "easyToUnderstand",
"label":"이해하기 쉬움"
},{
"type": "thumb-up",
"id": "solvedMyProblem",
"label":"문제가 해결됨"
},{
"type": "thumb-up",
"id": "otherUp",
"label":"기타"
}]
{"lastModified": "\ucd5c\uc885 \uc5c5\ub370\uc774\ud2b8: 2024-04-16(UTC)"}
[[["이해하기 쉬움","easyToUnderstand","thumb-up"],["문제가 해결됨","solvedMyProblem","thumb-up"],["기타","otherUp","thumb-up"]],[["필요한 정보가 없음","missingTheInformationINeed","thumb-down"],["너무 복잡함/단계 수가 너무 많음","tooComplicatedTooManySteps","thumb-down"],["오래됨","outOfDate","thumb-down"],["번역 문제","translationIssue","thumb-down"],["샘플/코드 문제","samplesCodeIssue","thumb-down"],["기타","otherDown","thumb-down"]],["최종 업데이트: 2024-04-16(UTC)"],[],[]]