목차
<link> 객체 정의 - 외부소스 연결 <link> 객체 구문 <link> 객체 예제 - 접근 <link> 객체 예제 - 생성 <link> 객체 속성
<link> 객체 정의 - 외부소스 연결
HTML <link> 태그(요소) 의미.
<link> 객체 구문
[접근]
var x = document.getElementById ("요소ID");
[생성]
var x = document.createElement ("LINK");
<link> 객체 예제 - 접근
<head>
<link id="hz" rel="stylesheet" type="text/css" href="https://homzzang.com/css/styles.css">
</head>
<button onclick="homzzang()">클릭</button>
<p id="demo"></p>
<script>
function homzzang() {
var x = document.getElementById("hz").href;
document.getElementById("demo").innerHTML = x;
}
</script>
결과보기
<link> 객체 예제 - 생성
<head>
</head>
<button onclick="homzzang()">클릭</button>
<script>
function homzzang() {
var x = document.createElement("LINK");
x.setAttribute("rel", "stylesheet");
x.setAttribute("type", "text/css");
x.setAttribute("href", "styles.css
document.head.appendChild(x);
}
</script>
결과보기
<link> 객체 속성
charset
HTML5 제외
연결된 문서의 문자 인코딩 설정/반환.
crossOrigin
링크된 문서의 CORS 설정 설정/반환
disabled
연결된 문서의 비활성화 여부 설정/반환.
href
연결된 문서의 URL 설정/반환.
hreflang
링크 된 문서의 언어코드 설정/반환.
media
링크 요소의 미디어유형 설정/반환.
rel
현재 문서와 링크된 문서 사이의 관계 설정/반환.
rev
HTML5 제외
연결된 문서에서 현재 문서로의 역관계 설정/반환.
sizes
연결된 리소스의 크기 속성값 반환
type
연결된 문서의 content type 설정/반환.
※ <link> 객체는 표준 속성/메서드 /이벤트 지원.
최신댓글