>웹 프론트엔드 >JS 튜토리얼 >자바스크립트를 사용하여 브라우저 제목을 수정하는 방법

자바스크립트를 사용하여 브라우저 제목을 수정하는 방법

亚连
亚连원래의
2018-06-23 14:49:121088검색

자바스크립트를 사용하여 브라우저 제목을 수정하는 방법과 기술을 알려드리겠습니다. 필요한 친구는 코드를 테스트할 수 있습니다.

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

innerText 메소드

console.log(document.getElementsByTagName("title")[0])을 통해 레이블에 텍스트 노드만 인쇄할 수 있음을 확인했습니다. TextNode만 인식이 가능하므로 innerText를 이용해 title의 값을 설정하여 성공하였습니다.

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

document.title 방식

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

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

Example

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('') 또는 $('title').text('')를 통해 수정할 수 있습니다.

위 내용은 제가 여러분을 위해 정리한 내용입니다. 앞으로 도움이 되길 바랍니다.

관련 기사:

jQuery가 로드되었는지 판단하는 방법

React Native 스크린샷 구성 요소를 사용하는 방법(자세한 튜토리얼)

React에서 state 및 setState를 사용하는 방법(자세한 튜토리얼)

Vue에서 휴대폰 인증 코드 구성 요소를 추가하는 방법

Vue에서 전역 console.log 스위치를 제어하는 ​​방법

스크롤을 따라가기 위해 페이지 하단의 팝업을 비활성화하는 방법

위 내용은 자바스크립트를 사용하여 브라우저 제목을 수정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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