当前位置:  开发笔记 > 编程语言 > 正文

如何使用jQuery为text-align动态添加样式

如何解决《如何使用jQuery为text-align动态添加样式》经验,为你挑选了3个好方法。

我正在尝试纠正CSS 2.1中常见的IE漏洞,需要一种方法来改变元素样式属性以添加自定义文本对齐样式.

目前在jQuery中你可以做类似的事情

$(this).width() or $(this).height() 

但我似乎无法找到一种改变文本的好方法 - 使用相同的方法.

该项已经有一个类,我在该类中设置text-align没有运气.在定义类之后,是否可以只向该元素添加text-align CSS属性?

我有类似的东西

$(this).css("text-align", "center"); 

在我的宽度调整之后,在我在firebug中查看之后,我看到只有"width"是样式上设置的唯一属性.有帮助吗?

编辑:

哇 - 对这个问题的回应很大!关于手头问题的更多细节:

我正在调整jqGrid A3.5 的js源来做一些自定义子网格工作,而我正在调整的实际JS如下所示(抱歉在上面的例子中使用"this",但是我想保持这个简单简洁)

var subGridJson = function(sjxml, sbid) {
    var tbl, trdiv, tddiv, result = "", i, cur, sgmap,
    dummy = document.createElement("table");
    tbl = document.createElement("tbody");
    $(dummy).attr({ cellSpacing: "0", cellPadding: "0", border: "0" });
    trdiv = document.createElement("tr");
    for (i = 0; i < ts.p.subGridModel[0].name.length; i++) {
        tddiv = document.createElement("th");
        tddiv.className = "ui-state-default ui-th-column";
        $(tddiv).html(ts.p.subGridModel[0].name[i]);
        $(tddiv).width(ts.p.subGridModel[0].width[i]);
        trdiv.appendChild(tddiv);
    }
    tbl.appendChild(trdiv);
}

我已经尝试了下面的两个(从提供的答案)没有运气.

$(tddiv).width(ts.p.subGridModel[0].width[i]).attr('style', 'text-align: center');

$(tddiv).width(ts.p.subGridModel[0].width[i]).css('text-align', 'center');

今天我将继续研究这个问题,并为那些在这个奇怪的问题上感到痛苦的人发布最终解决方案.



1> Tim Hoolihan..:

正如文档所示,您有正确的想法:

http://docs.jquery.com/CSS/css#namevalue

你确定你用class或id正确识别它吗?

例如,如果您的类是myElementClass

$('.myElementClass').css('text-align','center');

此外,我有一段时间没有与Firebug合作,但你是在看dom而不是html?您的来源不会被javascript更改,但dom是.查看dom选项卡,查看是否应用了更改.



2> kbosak..:

您还可以尝试以下操作为元素添加内联样式:

$(this).attr('style', 'text-align: center');

这应该确保其他样式规则不会覆盖您认为可行的内容.我相信内联样式通常优先.

编辑: 另外,另一个可以帮助你的工具是Jash(http://www.billyreisinger.com/jash/).它为您提供了一个javascript命令提示符,以便您可以确保轻松测试javascript语句并确保选择正确的元素等.



3> Nooshu..:

我经常使用

$(this).css({
    "textAlign":"center",
    "secondCSSProperty":"value" 
});

希望有所帮助

推荐阅读
跟我搞对象吧
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有