切换布局
显示结果
<!DOCTYPE html> <html> <head> <script type = "text/javascript" src = "https://cdn.jsdelivr.net/npm/d3@7"></script> <style> body { font-family: Arial; } </style> </head> <body> <ul id = "list"> <li></li> <li></li> </ul> <input type = "button" name = "remove" value = "Remove fourth value" onclick = "javascript:remove()" /> <script> d3.select("#list").selectAll("li") .data([10, 20, 30, 25, 15]) .text(function(d) { return "This is pre-existing element and the value is " + d; }) .enter() .append("li") .text(function(d) { return "This is dynamically created element and the value is " + d; }); function remove() { d3.selectAll("li") .data([10, 20, 30, 15]) .exit() .remove() } </script> </body> </html>