Блог

Главная - Вопросы по программированию - заменить тег на другим элементом dom с помощью d3.js

заменить тег на другим элементом dom с помощью d3.js

#javascript #d3.js

#javascript #d3.js

Вопрос:

Есть ли способ, которым мы можем заменить html-тег другим с помощью d3.js или просто Vanilla JS?, например, для замены <table></table> на <div></div> 

 <body>
  <div> 
    <table> ...... </table>
  </div> 
</body>

Я пробовал свою реализацию, но это привело к ошибке. Я не уверен, где я сделал неправильно. Мне нужны несколько советов по этому поводу

 var customStyle = function(){
  var tbl = d3.selectAll("#"   arcapi.chartId()   ' .crosstab-table-container table');
  tbl.attr('class','loppo');
  
  var mySpan = document.createElement("span");
  tbl.parentNode(mySpan, tbl);
}

Я предполагаю, что этот код не поддерживается, поскольку я выполняю настройку стороннего скрипта.

Ответ №1:

Как насчет того, чтобы найти теги, которые вы будете заменять, и его родительский узел, затем удалить этот тег и добавить другой, на который вы хотите заменить?

 const table = d3.select('#table');
const parent = d3.select(table.node().parentNode);

table.remove();
parent.append('div').text('append')

//console.log(parent)  
 <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>

<div>
11
  <table id="table"><tr><td>hello</td></tr></table>
</div>