안정적이고 범위가 명확한 CSS 선택자 생성 방법.
선택자는 대상을 충분히 구체적으로 식별하면서 작은 레이아웃 변경을 견딜 만큼 안정적이어야 합니다. 의미 있는 속성이 있으면 위치 기반 선택자를 피하세요.
작업에 맞게 절차를 조정하세요.
의미 있고 안정적인 속성이나 의미 관계를 선택하고 의도한 범위에서 선택자를 테스트하세요. 일치 요소 수를 확인하고 올바른 대상을 식별하는 데 필요한 경우에만 상태나 컨테이너를 포함하세요.
- 제공할 내용
- 제공된 DOM 조각과 대상 요소.
- 받을 결과
- 명시도와 안정성을 설명한 선택자.
입력과 결과를 확인하세요.
설명용 입력과 출력 · 실제 WebAct 실행이 아닌 학습용 예시
입력 항목 예시개
DOM contains a button with data-action="export".
완성된 예시
button[data-action="export"] targets the declared action; check that the attribute is unique within the intended scope.
이 입력을 프롬프트에 넣고 WebAct에 복사해 작업을 실행해 보세요. 결과는 설명용 예시와 다를 수 있습니다.
판단 기준과 문제 해결.
선택자가 목록에서 요소의 현재 위치에 의존해도 되나요?
가능하면 안정적인 의미를 우선하세요. 위치 기반 선택자는 작은 레이아웃이나 데이터 변경 후 다른 요소를 가리킬 수 있습니다.
선택자가 여러 내보내기 버튼에 일치하는 이유는 무엇인가요?
관련 컨테이너로 범위를 좁히거나 지원되는 구별 속성을 추가하세요. 동작에 사용하기 전에 일치 수를 검증하세요.
직접 준비한 자료로 시도하세요.
작업 프롬프트의 예시를 내 자료로 바꾸세요. 필요한 요구 사항은 유지하고 작업을 WebAct에 복사하세요.
작업 맞춤 설정 및 복사 ↑