>웹 프론트엔드 >HTML 튜토리얼 >src와 href의 차이점은 무엇입니까

src와 href의 차이점은 무엇입니까

百草
百草원래의
2023-08-18 13:44:073020검색

src와 href는 용도, 태그, 로딩 방법, 문서에 미치는 영향, 선택사항이 다릅니다. 자세한 소개: 1. src는 외부 리소스의 주소를 지정하는 데 사용되며 href는 하이퍼링크의 대상 리소스 주소를 지정하는 데 사용됩니다. 2. src는 일반적으로 img 태그, 스크립트 태그, 오디오 태그, 비디오 태그에 사용됩니다. 등이며 href 속성은 일반적으로 태그, 링크 태그, @import 지시문 등에 사용됩니다. 3. src 속성이 가리키는 리소스는 브라우저 등에 의해 즉시 로드되고 구문 분석됩니다.

src와 href의 차이점은 무엇입니까

이 튜토리얼의 운영 체제: Windows 10 시스템, Dell G3 컴퓨터.

src 및 href는 HTML 및 XML 문서에서 외부 리소스를 참조하는 데 일반적으로 사용되는 두 가지 속성입니다. 유사한 작업을 수행하더라도 사용법과 기능에는 약간의 차이가 있습니다.

다른 용도:

src(소스) 속성은 외부 리소스의 주소를 지정하는 데 사용되며 일반적으로 스크립트 파일, 이미지 파일, 오디오 파일, 비디오 파일 등을 소개하는 데 사용됩니다. 현재 문서에 외부 리소스를 포함하도록 브라우저에 지시합니다.

href(하이퍼텍스트 참조) 속성은 하이퍼링크의 대상 리소스 주소를 지정하는 데 사용됩니다. 일반적으로 다른 HTML 문서, 스타일 시트, 글꼴 파일, ICO 파일 등에 연결하는 데 사용됩니다.

다른 태그:

src 속성은 일반적으로 img 태그, 스크립트 태그, 오디오 태그, 비디오 태그 등에 사용되어 해당 리소스를 소개합니다.

href 속성은 일반적으로 태그, 링크 태그, @import 지시문 등에 사용되어 링크를 생성합니다.

로드 방법은 다릅니다.

src 속성이 가리키는 리소스는 브라우저에 의해 즉시 로드되고 구문 분석됩니다. 로드 프로세스 중에 브라우저는 리소스가 다운로드되어 실행될 때까지 다른 리소스 로드와 문서 렌더링을 일시 중지합니다.

href 속성이 가리키는 리소스는 문서가 로드될 때 비동기적으로 로드되며 문서 렌더링을 차단하지 않습니다. 브라우저는 여러 리소스를 병렬로 로드하고 문서를 계속 렌더링합니다.

문서에 미치는 영향의 차이:

src 속성은 문서의 구조와 내용에 직접적인 영향을 미칩니다. 예를 들어, img 태그의 src 속성으로 지정된 이미지 리소스는 문서에서 해당 위치를 차지합니다.

href 속성은 문서의 구조와 내용에 직접적인 영향을 미치지 않습니다. 예를 들어 링크 태그의 href 속성으로 지정된 스타일 시트는 CSS 규칙을 통해 문서의 스타일을 변경합니다.

다른 옵션:

src 속성이 필요합니다. src 속성이 지정되지 않으면 브라우저는 태그가 유효하지 않은 것으로 간주합니다.

href 속성은 선택사항입니다. href 속성이 지정되지 않은 경우에도 태그는 유효합니다.

요약하자면, src는 삽입할 외부 리소스의 주소를 지정하는 데 주로 사용되는 반면, href는 다른 리소스의 주소에 대한 하이퍼링크를 만드는 데 주로 사용됩니다. src는 리소스를 즉시 로드하고 문서 구조와 콘텐츠에 영향을 미치는 반면, href는 리소스를 비동기적으로 로드하며 문서 구조와 콘텐츠에 직접적인 영향을 주지 않습니다. src와 href의 차이점을 이해하는 것은 이를 올바르게 사용하고 웹 페이지 성능을 최적화하는 데 중요합니다.

위 내용은 src와 href의 차이점은 무엇입니까의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.