Вот моя расширенная версия кода alex, которую я использую в производстве:
(function($) {
function getStyle(element, style) {
var result;
if (document.defaultView && document.defaultView.getComputedStyle) {
result = document.defaultView.getComputedStyle(element, '').getPropertyValue(style);
} else if(element.currentStyle) {
style = style.replace(/\-(\w)/g, function (strMatch, p1) {
return p1.toUpperCase();
});
result = element.currentStyle[style];
}
return result;
}
function replaceRecursive(element, lang) {
if(element.lang) {
lang = element.lang; // Maintain language context
}
if (element && element.style && getStyle(element, 'text-transform') == 'uppercase') {
if (lang == 'tr' && element.value) {
element.value = element.value.replace(/ı/g, 'I');
element.value = element.value.replace(/i/g, 'İ');
}
for (var i = 0; i < element.childNodes.length; ++i) {
if (lang == 'tr' && element.childNodes[i].nodeType == Node.TEXT_NODE) {
element.childNodes[i].textContent = element.childNodes[i].textContent.replace(/ı/g, 'I');
element.childNodes[i].textContent = element.childNodes[i].textContent.replace(/i/g, 'İ');
} else {
replaceRecursive(element.childNodes[i], lang);
}
}
} else {
if (!element.childNodes || element.childNodes.length == 0) return;
for (var i = 0; i < element.childNodes.length; ++i) {
replaceRecursive(element.childNodes[i], lang);
}
}
}
$(document).ready(function(){ replaceRecursive(document.getElementsByTagName('html')[0], ''); })
})(jQuery);
Обратите внимание, что здесь я использую jQuery только для функции ready()
. Оболочка совместимости с jQuery также является удобным способом для пространства имен функций. Кроме этого, две функции вообще не зависят от jQuery, так что вы можете их извлечь.
По сравнению с оригинальной версией Алекса эта проблема решает пару проблем:
Он отслеживает атрибут lang во время его повторения, поскольку, если вы смешали турецкий и другой латинский контент, вы получите неправильные преобразования для нетурецкого без него. В соответствии с этим я передаю базовый элемент html
, а не body
. Вы можете прикрепить lang="en"
к любому тегу, который не является турецким, чтобы предотвратить неправильную капитализацию.
Применяет преобразование только к TEXT_NODES
, поскольку предыдущий метод innerHTML
не работал со смешанными узлами текста / элемента, такими как метки с текстом и флажки внутри них.
Несмотря на некоторые заметные недостатки по сравнению с серверным решением, оно также имеет ряд существенных преимуществ, главным из которых является гарантированное покрытие без необходимости знать на стороне сервера, какие стили применяются к какому контенту. Если какой-либо контент индексируется и показывается в сводках Google (например), гораздо лучше, если он будет отображаться в нижнем регистре.