[英]Is it possible to set the inner HTML of an element with a file using d3js?
I am trying to clean up some code that I am writing and I had a thought: Would it be possible to set the inner HTML of a component using d3js like the code below?我正在尝试清理我正在编写的一些代码,我有一个想法:是否可以使用 d3js 设置组件的内部 HTML,如下面的代码?
d3.select("body").append("div").html(d3.html("../components/modal.html"));
If this is possible, what is needed to make it work, because right now, this only puts a text field on the page that says [object Promise]
如果这是可能的,需要什么才能让它工作,因为现在,这只会在页面上放置一个文本字段,上面写着
[object Promise]
Is this only wishful thinking?这只是一厢情愿吗?
EDIT: I am using Bootstrap 5 to implement my modal编辑:我正在使用 Bootstrap 5 来实现我的模态
UPDATE:更新:
As I described in a comment below, I took the code from @SmokeyShakers answer---正如我在下面的评论中所描述的,我从@SmokeyShakers 答案中获取了代码---
d3.html("../components/modal.html").then((data) => {
d3.select("body").append("div").html(data)
})
---and replaced the first .html(...)
with .text(...)
as so: ---并将第一个
.html(...)
替换为.text(...)
,如下所示:
d3.text("../components/modal.html").then((data) => {
d3.select("body").append("div").html(data)
})
This made it so that the modal would actually render, but the buttons and other functionalities I had built into the modal wouldn't work.这使得模态实际上可以渲染,但是我在模态中内置的按钮和其他功能将不起作用。 And for additional information, my modal buttons did not have an
onclick="..."
attribute in the inline HTML, but it was added using对于其他信息,我的模态按钮在内联 HTML 中没有
onclick="..."
属性,但它是使用添加的
d3.select('#my-modal-submit').on('click', ()=>{...})
Try this out.试试这个。 d3.html is a fetch, so I think you need to go inside out:
d3.html 是一个提取,所以我认为你需要从里到外:
d3.html("../components/modal.html").then((data) => {
d3.select("body").append("div").html(data)
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.