質問失礼します。
よろしければご教授いただければ幸いです。
現在、日本語と英語に対応したサイトの制作にあたり、言語の切り替えをヘッダーとフッター(PHPで共通化)の2カ所あるリンクからjavascriptで実装したいと考えております。
(例:アクセスページのドメイン)
日本語:https://.com/access
英語 :https://.com/en/access
プログラミングに詳しくなく、不備も多く恐縮ですが下記がコードとなります。
■問題点
①切り替えリンクがヘッダーとフッター2箇所にあるため、getElementByIdだと対応は出来ないと思うので、querySelectorAllやgetElementsByClassNameで対応しようと思ったのですが、うまく動かず苦戦しております。
→2箇所ある場合、どのように修正すれば動作するかご教授いただければ幸いです。
②英語から日本語ページへの遷移ができることは確認できましたが、日本語から英語ページへの切り替えは全く動作しない状態です。
→日本語ページから英語ページへの切り替えの記述をどのように修正すれば、動作するかご教授いただければ幸いです。
■HTML(切り替えボタン)
<button id="language-switch">切り替えボタン</button>
■Javascript
let url = location.href;
const beforeDomain = 'https://*****.com/';
const afterDomain = url.replace( beforeDomain , '' );
document.querySelectorAll('#language-switch').addEventListener('click', function() {
//ページ内リンクを削除
if (url.match('#')) {
url.substring(0, url.indexOf('#'));
}
// URLに「/en/」を含む場合、「/en/」を取って日本語サイトへ
if ( url.match(new RegExp('/en/')) ){
const url_ja = url.replace('/en/', '/');
location.href = url_ja;
// 日本語トップページと下層ページで条件分岐してURLに「en/」を加え英語サイトに変更
} else {
if ( url == beforeDomain ) {
location.href = url + 'en/';
} else {
url = url.replace(lastDir + '/' , '')
location.href = url + 'en/' + lastDir + '/';
}
}
}, false);
お忙しいところ大変恐縮ですがよろしければお願いいたします。
回答1件
あなたの回答
tips
プレビュー