Question

我正在尝试纠正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');

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

Answer 1

您有正确的想法，正如文档所示：

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

你确定你是否正确地用类或id识别它？

例如，如果您的类是myElementClass

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

另外，我有一段时间没有使用过Firebug，但是你在看dom而不是html吗？您的来源不会被javascript更改，但dom是。查看dom选项卡，查看是否应用了更改。

Answer 2

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

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

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

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

Answer 3

我通常使用

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

希望有所帮助

Answer 4

我认为你应该使用“textAlign”而不是“text-align”。

Answer 5

有趣。我在编写测试版时遇到了同样的问题。

解决方案是使用jquery的chain能力并执行：

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

有趣的发现。

要扩展一下，以下操作不工作

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

并且仅在样式上设置宽度。如上所述，将这两者联系起来似乎确实有效。

Answer 6

$(this).css("text-align", "center");应该有效，请确保'this'是您实际尝试将文本对齐样式设置为的元素。

Answer 7

是对的吗？

<script>
$( "#box" ).one( "click", function() {
  $( this ).css( "width", "+=200" );
});
</script>

Answer 8

<!DOCTYPE html>
<html>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script>
      $( document ).ready(function() {
      $this = $('h1');
         $this.css('color','#3498db');
         $this.css('text-align','center');
         $this.css('border','1px solid #ededed');
      });
    </script>

  </head>
  <body>
      <h1>Title</h1>
 </body>
</html>

Answer 9

 $(this).css({'text-align':'center'});

您可以使用班级名称和ID代替此

$('.classname').css({'text-align':'center'});

或

$('#id').css({'text-align':'center'});

Answer 10

function add_question（）{ var count = document.getElementById（“nofquest”）。value; var container = document.getElementById（“container”）; //清除容器的先前内容 while（container.hasChildNodes（）） { container.removeChild（container.lastChild）; } for（i = 1; i

如何设置文本框的中心

Answer 11

假设下面是html段落标记：

<p style="background-color:#ff0000">This is a paragraph.</p>

我们想在jquery中更改段落颜色。

客户端代码将是：

<script>
$(document).ready(function(){
    $("p").css("background-color", "yellow");
});
</script>

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

11 个答案: