如何使用jQuery动态添加文本对齐样式

Question 1

我正在尝试纠正CSS 2.1周围常见的IE错误，并且需要一种更改元素样式属性以添加自定义文本对齐样式的方法。

目前在jQuery中，您可以执行以下操作

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

但我似乎找不到一种用这种方法来改变文本对齐的好方法。

该项目已经有一个类，我在该类中设置了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');

今天，我将继续处理此问题，并为所有对此陌生问题感到痛苦的人提供最终解决方案。

Question 2

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

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

您确定您使用类或ID正确标识了此名称吗？

例如，如果您的班级是myElementClass

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

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

Question 3

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

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

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

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

Question 4

我通常用

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

希望有帮助

Question 5

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

Question 6

有趣。编写测试版本时，我遇到了与您相同的问题。

解决方案是使用jquery的链接功能并执行以下操作：

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

有趣的发现。

为了扩大一点，下面确实没有工作

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

并且只会导致在样式上设置宽度。正如我上面建议的那样，将两者链接起来似乎确实可行。

Question 7

$(this).css("text-align", "center"); 应该可以正常工作，请确保“这”是您实际上试图将文本对齐样式设置为的元素。

Question 8

是正确的？

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

Question 9

<!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>

Question 10

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

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

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

要么

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

Question 11

假设下面是html段落标记：

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

并且我们想在jQuery中更改段落颜色。

客户端代码将是：

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

Question 12

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

如何设置文本框的中心