브라우저 제목(제목)을 동적으로 수정하는 JavaScript 방법

JavaScript를 사용하여 브라우저 제목(제목)을 동적으로 수정하는 방법과 기술에 대해 알려 드리겠습니다. 필요한 친구는 코드를 테스트할 수 있습니다.

title은 HTML의 특수 노드 요소입니다. document.getElementsByTagName("title")[0]을 사용하여 웹 페이지의 제목 태그를 가져올 수 있지만 document.getElementsByTagName("title"은 사용할 수 없기 때문입니다. ") [0].innerHtml은 값을 변경하는 데 사용됩니다. 테스트 후 네이티브 js를 수정하는 방법은 두 가지가 있으며, jQuery에서도 쉽게 설정할 수 있습니다. 확실하지 않은 친구는 알아낼 수 있습니다.

innerText 메서드

console.log(document.getElementsByTagName("title")[0])를 통해, b2386ffb911b14667cb8f0f91ea547a7 레이블을 인쇄할 수 있다는 것을 알았습니다. 레이블에는 텍스트 노드만 있으므로 TextNode만 인식할 수 있는 것 같아서 innerText를 사용하여 제목 값을 설정했는데 작동했습니다.

document.getElementsByTagName("title")[0].innerText = '需要设置的值';

document.title 메소드

테스트 후 document.title을 통해서도 title 값을 설정할 수 있습니다.

console.log(document.title);      # 可以获取title的值。
document.title = '需要设置的值';    # 设置title的值。

예:

window.onfocus = function () {
 document.title = '恢复正常了...';
};
window.onblur = function () {
 document.title = '快回来~页面崩溃了';
};

브라우저가 포커스를 얻고 포커스를 잃을 때 제목 값을 변경합니다. 브라우저 탭을 전환하면 제목이 변경되는 것을 알 수 있습니다.

jQuery 메서드

물론 프로젝트가 jQuery에 의존하는 경우 jq 메서드를 사용하여 설정할 수 있습니다.

$('title').html('')

$('title').text('')

두 방법 모두 jq에서 달성할 수 있습니다

요약

네이티브 js에서는 innerText를 전달할 수 있습니다. document.title 웹페이지 제목을 동적으로 수정하는 방법은 두 가지가 있습니다.

jq에서는 $('title').html('') 또는 $('를 통해 수정할 수 있습니다. 제목').text('') .

위 내용은 JavaScript로 브라우저 제목(제목)을 동적으로 수정하는 자세한 방법입니다. 더 많은 관련 튜토리얼을 보려면 JavaScript 동영상 튜토리얼을 방문하세요!