jQuery만으로 HTML 페이지에 기본 현지화를 추가하는 방법
5796 단어 htmljavascript
I want basic translation on my single, static HTML page but I don't want to import no complex JS lib... What do I do?
아주 간단해 내 친구
HTML 구조
<html lang="en">
<body>
<p lang="en">English please!</p>
<p lang="fr">Hon hon croissant baguette!</p>
<button type="button" lang="fr" data-toggle="lang" data-lang="en">English</button>
<button type="button" lang="en" data-toggle="lang" data-lang="fr">Français</button>
<script src="jquery.js"></script>
<script src="language.js"></script>
</body>
</html>
jQueryhere를 받으십시오. 원하지 않는다면 아래 스크립트의 바닐라 버전을 직접 만들 수 있다고 생각합니다.
JS 스크립트
$('[data-toggle="lang"]').click(function(event) {
event.preventDefault();
$('html').attr('lang', $(this).attr('data-lang'));
});
// auto-detect the best lang setting
const params = new URLSearchParams(window.location.search);
if (params.has('lang')) {
$('html').attr('lang', params.get('lang'));
} else if (navigator.language.match(/^(en|fr)/)) {
$('html').attr('lang', navigator.language.substr(0, 2))
}
그게 다야 HTML은 이제
lang
태그의 <html>
속성에 응답합니다. URL에 ?lang=fr
를 추가하여 제어하거나 navigator.language
로 브라우저가 결정하도록 할 수 있습니다.즐기다!
Reference
이 문제에 관하여(jQuery만으로 HTML 페이지에 기본 현지화를 추가하는 방법), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/bdelespierre/how-to-add-basic-localization-to-your-html-page-with-just-jquery-ncl텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)