更改HTML / JavaScript中選擇框的位置

Question

我在html div中有一個選擇框

<div id="selectionBox"></div>

我正在嘗試更改此框的位置，但是下面的代碼不起作用。 從某種意義上說，選擇框保持在原處，它根本不會移動。

有人可以向我解釋為什么這個方法不起作用以及如何解決嗎？

var select = d3.select("#selectionBox")
  .append('select')
    .attr("transform", "translate(" + 100 + "," + 50 + ")")
    .attr('class', 'select')
    .text("Failure Mode")
    .on('change', onchange);

Answer 1

如果您的代碼不起作用，請嘗試更改元素的CSS樣式，如下所示：

    document.getElementById("selectionBox").style = " margin-left:10px; margin-top:10px; ";
    //Just fill it with your properties

Answer 2

您忘記在.attr("transform", "translate(" + 100 + "," + 50 + ")")添加px 。

參見翻譯 。

您的代碼應為：

var select = d3.select("#selectionBox")
  .append('select')
    .attr("transform", "translate(" + 100 + "px," + 50 + "px)")
    .attr('class', 'select')
    .text("Failure Mode")
    .on('change', onchange);

使用document.getElementById() ：

您可以使用setAttribute()方法添加以下transform: translate(100px, 50px)至selectionBox元素。

像這樣：

document.getElementById("selectionBox").setAttribute("style", "transform: translate(" + 100 + "px," + 50 + "px)");