使用 javascript 将所有具有 text-align justify 的类的 text-align 更改为 left答案

【问题标题】：change text-align to left with javascript for all classes with text-align justify使用 javascript 将所有具有 text-align justify 的类的 text-align 更改为 left
【发布时间】：2011-02-16 16:01:51
【问题描述】：

我需要在移动设备上显示一些静态 HTML 内容。这些文件已经有了自己的 CSS 样式，还有很多很多类。

为了提高小屏幕的可读性，我想将所有带有 text-align:justify 的类更改为 text-align:left。

我认为最合适的解决方案是修改webViewDidFinishLoad 方法中的样式。如何使用 Javascript 完成此操作？

提前致谢

【问题讨论】：

标签： javascript iphone css uiwebview

【解决方案1】：

这样解决：

var styleSheets = document.styleSheets;
for( i=0; i < styleSheets.length; i++ ){
    for( j=0; j < styleSheets[i].cssRules.length; j++){
        var rule = styleSheets[i].cssRules[j];            
        if(rule.style.textAlign=='justify'){
            rule.style.textAlign='left';
        }
    }
}

这可行，但我仍然对没有 jQuery 的更优雅的解决方案感兴趣。

【讨论】：

【解决方案2】：

这是一种可怕的方式，我实际上不会使用自己，因为它为每个元素添加了内联样式。如果不指定您希望它作用的类或元素，我想不出任何其他方法。

http://jsfiddle.net/alangilby/e7XfU/

但有趣的实验。哦，你不想要 jquery。

【讨论】：

【解决方案3】：

这个问题已经很老了，但是，我想我会提供我的答案以供参考。不确定这是否有助于满足您的需求，但是，这是我过去用来将 text-align:left 应用于整个正文的一种非 jQuery 方式。

    NSString* css = @"\"body { text-align:left;}\"";
    NSString* js = [NSString stringWithFormat:
                    @"var styleNode = document.createElement('style');\n"
                    "styleNode.type = \"text/css\";\n"
                    "var styleText = document.createTextNode(%@);\n"
                    "styleNode.appendChild(styleText);\n"
                    "document.getElementsByTagName('head')[0].appendChild(styleNode);\n",css];
    [self.webView stringByEvaluatingJavaScriptFromString:js];

【讨论】：