HTML에서 href와 src는 거의 유사한 작동을 한다.

href의 경우

<link rel="stylesheet" type="text/css" href="style.css"/>


이 와 같이 사용한다.

그런데 href 부분을 src로 사용해도 작동한다. 물론 결과도 동일하다.

자바스크립트 파일의 경우에 <script type="text/javascript" src="foobar.js"/> 와 같이 사용한다.


href 의 경우에는 브라우저의 html 파일 불러오기와 href에 링크된 파일을 가져오는 것을 병렬로 처리하고

src의 경우에는 src에 링크된 파일을 가져오는 동안 브라우저가 페이지를 불러오는 것을 일시 중지하고 가져온 후에 다시 페이지를 불러온다.

src에 링크된 파일이 모두 받아진 이후에 페이지가 불리워짐

그런데 왜 href와 src로 나누었을까?


w3c의 comment에 따르면

http://www.w3.org/TR/1999/REC-html401-19991224/index/attributes.html
URI for linked resource 라고 Comment가 되어있다

src는

script - URI for an external script
img - URI of image to embed

이렇게 적혀있다.

사용상의 결과적으로는 같은 외부의 무언가를 가져오는 것이다.


link 태그에서 이상한것은 약간 다른점은 stylesheet같은경우 외부 주소의 파일을 가져올 수 있고

a 태그에서는 외부의 것을 가져오는 것이아니라 그냥 연결을 위한 주소를 사용한다

보통 link태그에서는 href 속성이 다른 리소스를 연결하는 목적지를 나타낸다.

link 태그에서 href 속성이 없으면 link를 정의하지 않는다(src로 써도 되기는 함)

a 태그에서는 href 속성이이동할 URL을 정의한다.

갈수록 미궁으로..


stackoverflow에 보면 http://stackoverflow.com/questions/3395359/difference-between-src-and-href&usg=ALkJrhiOUA

여러가지 논쟁이 벌어진걸 알 수 있는데

href는 가져올 수 있는 리소스를 사용자가 요청
src는 브라우저가 가져와야 리소스를 보여줌

이렇다는데..

어찌 처리하는지 나중에 다시..

 


출처 http://parkcj.wordpress.com/2012/10/24/html-href-%EC%99%80-src-%EC%9D%98-%EC%B0%A8%EC%9D%B4/

 

 


Posted by 장안동베짱e :