利用OpenCC库简体到繁体转换示例(html全局页面操作)
参考资料:https://www.heiqw.com/post-155.html
注意:需要哪种转换的时候就需要载入哪种js插件
,不然像我以为代码库用不了,比如我的代码是简转繁,那么我就必须引用cn2t.js而不是t2cn.js,否则报错
哈哈哈
<!DOCTYPE html>
<html lang="zh-HK">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>OpenCC 繁体到简体转换示例</title>
<script src="https://cdn.jsdelivr.net/npm/opencc-js@1.0.5/dist/umd/cn2t.js"></script>
</head>
<body>
<h1>欢迎来到我们的网站</h1>
<p>这是一个测试页面,确定吗。</p>
<script>
// 判断当前 URL 是否包含 lang=tc
function shouldConvert() {
const urlParams = new URLSearchParams(window.location.search);
return urlParams.get('lang') === 'tc'; // 如果 lang 参数是 tc,表示需要转换
}
// 初始化 OpenCC 转换器,配置从繁体(中国香港)到简体中文(中国大陆)
const converter = OpenCC.Converter({ from: 'cn', to: 'hk' });
// 将网页内容进行转换
function convertContent() {
const rootNode = document.documentElement; // 获取整个 HTML 页面
convertNodeText(rootNode); // 转换整个文档中的文本节点
}
// 递归遍历并转换所有文本节点
function convertNodeText(node) {
if (node.nodeType === Node.TEXT_NODE) {
node.textContent = converter(node.textContent); // 转换文本节点内容
}
// 遍历子节点
node.childNodes.forEach(child => {
convertNodeText(child);
});
}
// 执行转换操作
if (shouldConvert()) {
convertContent();
}
</script>
</body>
</html>