jquery / javascript를 통해 추가하는 방법은 무엇입니까?
<head>
요소에 대한 HTML 소스 편집을 방지하는 CMS로 작업 합니다.
예를 들어 <title>
태그 위에 다음을 추가하고 싶습니다 .
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
선택하여 정상적으로 추가 할 수 있습니다.
$('head').append('<link />');
자바 스크립트 :
document.getElementsByTagName('head')[0].appendChild( ... );
DOM 요소를 다음과 같이 만드십시오.
link=document.createElement('link');
link.href='href';
link.rel='rel';
document.getElementsByTagName('head')[0].appendChild(link);
jQuery
$('head').append( ... );
자바 스크립트 :
document.getElementsByTagName('head')[0].appendChild( ... );
임시 요소 (예 DIV
:)를 만들고 HTML 코드를 innerHTML
속성에 할당 한 다음 자식 노드 를 HEAD
요소에 하나씩 추가합니다 . 예를 들면 다음과 같습니다.
var temp = document.createElement('div');
temp.innerHTML = '<link rel="stylesheet" href="example.css" />'
+ '<script src="foobar.js"><\/script> ';
var head = document.head;
while (temp.firstChild) {
head.appendChild(temp.firstChild);
}
HEAD
를 통해 전체 내용을 다시 쓰는 것과 비교할 때 innerHTML
이는 요소의 기존 자식 요소 HEAD
에 어떤 식 으로든 영향을주지 않습니다 .
참고 스크립트 스타일이 성공적으로 적용하는 동안이 방법으로 삽입 분명히, 자동으로 실행되지 않습니다. 따라서 스크립트를 실행해야하는 경우 Ajax를 사용하여 JS 파일을로드 한 다음 eval()
.
최신 브라우저 (IE9 +)에서는 document.head 를 사용할 수도 있습니다 .
예:
var favicon = document.createElement('link');
favicon.id = 'myFavicon';
favicon.rel = 'shortcut icon';
favicon.href = 'http://www.test.com/my-favicon.ico';
document.head.appendChild(favicon);
innerHTML
추가 필드 문자열을 연결하는 데 사용할 수 있습니다 .
document.head.innerHTML = document.head.innerHTML + '<link rel="stylesheet>...'
그러나 헤드에 추가 한 추가 항목이 첫 번째로드 후 브라우저에서 인식된다는 것을 보장 할 수 없으며 추가 스타일 시트가로드 될 때 FOUC (스타일이 지정되지 않은 콘텐츠 플래시)가 표시 될 수 있습니다.
I haven't looked at the API in years, but you could also use document.write
, which is what was designed for this sort of action. However, this would require you to block the page from rendering until your initial AJAX request has completed.
Try a javascript pure:
Library JS:
appendHtml = function(element, html) {
var div = document.createElement('div');
div.innerHTML = html;
while (div.children.length > 0) {
element.appendChild(div.children[0]);
}
}
Type: appendHtml(document.head, '<link rel="stylesheet" type="text/css" href="http://example.com/example.css"/>');
or jQuery:
$('head').append($('<link rel="stylesheet" type="text/css" />').attr('href', 'http://example.com/example.css'));
i don't know why i hate using jquery. i gave head an id of 'head'.
<head id="head">
<meta charset="utf-8">
<title></title>
</head>
<script type="text/javascript">
var head = document.getElementById('head');
if (window.screen.width<800) {
head.innerHTML = " <link rel='stylesheet' href='../css/gallerys.css?ver=1.2'>";
}else {
head.innerHTML="<link rel='stylesheet' href='../css/gallerys.css?ver=1.3'>";
}
</script>
With jquery you have other option:
$('head').html($('head').html() + '...');
anyway it is working. JavaScript option others said, thats correct too.
참고URL : https://stackoverflow.com/questions/1900874/how-to-add-anything-in-head-through-jquery-javascript
'development' 카테고리의 다른 글
Google지도 v3-보기 가능 영역 및 확대 / 축소 수준 제한 (0) | 2020.08.27 |
---|---|
Fabric에서 SSH 키 파일 사용 (0) | 2020.08.27 |
mod_rewrite가 서버에서 활성화되었는지 확인하는 방법은 무엇입니까? (0) | 2020.08.27 |
ID 대신 이름으로 요소 값을 가져 오는 방법 (0) | 2020.08.27 |
프로그래밍 방식으로 iPhone 키보드 위에 도구 모음 정렬 (0) | 2020.08.27 |