javascript 如何使用jQuery将'style=display:“block”'添加到元素中?

ckx4rj1h  于 2023-01-29  发布在  Java
关注(0)|答案(5)|浏览(208)

如何将style=display:"block"添加到jQuery中的元素?

ctzwtxfj

ctzwtxfj1#

$("#YourElementID").css("display","block");

**编辑:**或者就像戴夫·蒂本在下面的评论中指出的那样,你也可以这么做:

$("#YourElementID").css({ display: "block" });
dvtswwa3

dvtswwa32#

有多个函数来完成这项工作,写在底部的基础上的优先级。

  • ∮ ∮ ∮ ∮

为匹配的元素集设置一个或多个CSS属性。

$("div").css("display", "block")
// Or add multiple CSS properties
$("div").css({
  display: "block",
  color: "red",
  ...
})
  • ∮ ∮ ∮ ∮

显示匹配的元素,大致相当于调用.css("display", "block")
您可以改用.show()显示元素

$("div").show()
  • ∮ ∮ ∮ ∮

为匹配的元素集设置一个或多个属性。
如果目标元素没有style属性,则可以使用此方法向元素添加内联样式。
一个三个三个一个

  • ###JavaScript语言

如果不想使用jQuery,可以使用pure javascript为元素添加特定的CSS属性。

var div = document.querySelector("div");
// One property
div.style.display = "block";
// Multiple properties
div.style.cssText = "display:block; color:red"; 
// Multiple properties
div.setAttribute("style", "display:block; color:red");
xdyibdwo

xdyibdwo3#

根据设置display属性的目的,您可能需要查看

$("#yourElementID").show()

以及

$("#yourElementID").hide()
cunj1qz1

cunj1qz14#

如果您需要添加多个,那么您可以这样做:

$('#element').css({
    'margin-left': '5px',
    'margin-bottom': '-4px',
    //... and so on
});

作为一个很好的实践,我也会把属性名称之间的引号,以允许破折号,因为大多数样式有一个破折号在他们。如果它是'display',那么引号是可选的,但如果你有一个破折号,它将无法工作,没有引号。无论如何,让它简单:请始终将它们括在引号中。

kxkpmulp

kxkpmulp5#

如果您使用的是BS5Tabulator,我发现我必须将position: static添加到单元格中,并将其添加到按钮中。
因此,我添加了以下CSS:

.table-responsive .dropdown,
    .table-responsive .btn-group,
    .table-responsive .btn-group-vertical {
        position: static;
    }

Tabulator div上有:

<div id="myTable" class="table-sm table-responsive"></div>

最后是我做的事

myTable.on("dataProcessed", function(data){
  $('[tabulator-field="my_fancy_field"]').css("position", "static");
});

您将需要某种方法来找到正确的单元格。我使用了正在从中加载数据的field
最后(在大多数行上)得到的结果如下所示:

在最后一行,它像这样向上弹出:

相关问题