将jQuery数据表附加为<span>而不是<div>

Question

我正在尝试在我的地球旁边创建一个数据表，如this one。我能够使用jQuery datatable创建表格。但是，它在div中创建表而不是在我的地球旁边的跨度中。截图如下： 我想达到这样的效果： 我相信我必须使用span标签。 #currentInfo是地球仪所在的div。 我试过了

$("#currentInfo").append("<span id='createSpan'></span>");
$("#createSpan").append("<table id='example' class='display compact' width='50%'></table>");

似乎没有任何改变。该表创建为全球范围内的div。所以我试过了：

$("#currentInfo").append("<span><table id='example' class='display compact' width='50%'></table></span>");

结果仍然相同。返回的数据为<div><span>data</span><span>data</span>.....</div>

以下代码完全跳过包括表格。

$("#currentInfo").append("<span id='example' class='display compact' width='50%'></span>");

我也收到错误： DataTables警告：非表节点初始化（SPAN）。有关此错误的详细信息，请参阅http://datatables.net/tn/2。这让我相信jQuery数据表必须使用 table 标记以下面的格式附加，并且将创建一个div并自动包装数据。

 $("#elementId").append("<table id='example' class='display compact' width='50%'></table>");

我可以通过

添加范围文本

$("#currentInfo").append("<span id='temp'>Add span text here</span>");

走向全球。 我可以设置我的数据样式并将其作为一个跨度附加，但有很多读取使用jQuery数据表附带的特权（排序，格式等）

有没有办法可以覆盖jQuery datatable div属性，所以它创建了将表包装在span标签而不是div中？或者可以再建议一个允许我实现这个目标的不同数据库吗？

Answer 1

感谢@A. Wolff和@davidkonrad的启示。我正在思考做一些简单事情的漫长而曲折的方式。地球确实有绝对的造型。绝对和和z索引的使用很好地解决了我的问题。为希望将表格添加到地球的任何人发布我的解决方案作为未来参考：

#example_wrapper {
    padding: 5%;
    padding-top: 20%;
    position: absolute;
    width: 40%;
    background-color: black;
    height: 700px;
    z-index: 3
} 

#globeImageContainer {
  margin: 0;
  padding: 0;
  background: #000000;
  color: #ffffff;
  font-family: sans-serif;
  font-size: 13px;
  line-height: 20px;
  height: 900px;
  width: 100%;
  position: absolute;
  }

canvas {
    right: 0px;
    left: 5%;
    top:0px;
    position: absolute;
    width: 75%;
}

请注意#globeImageContainer是我的自定义div，我将我的地球和表放入。＃example_wrapper附带了jQuery数据表库。 Canvas附带全球图书馆。