在JavaScript中设置动态创建元素的图像源

我正在尝试获取

JavaScript

中动态创建的元素的id，以将src设置为：

$scope.source = canvas.toDataURL();
let htmlString = "<img id='imageId' style='height: 100px; width: 100px;'>";
let doc = document.createElement('div');
doc.innerHTML = htmlString;
let image = doc.getElementById('imageId');
image.src = $scope.source;

$scope.source=canvas.toDataURL（）；
让htmlString=”
但我总是得到未定义的图像，因为在文档中没有getElementById方法

如何在此设置图像源？
HTML元素没有
getElementById（）
方法，该方法是
HTMLDocument
类的
文档
实例的一部分，但您的var
文档
引用的是新创建的
，而不是文档。您可以使用：

let image = document.getElementById('imageId');

但是，在您真正将图像放入文档之前，这实际上是不起作用的，而在您附加
之前，这是不起作用的

或者，在现代浏览器上（我假设您使用的是ES6语法），您可以使用：

let image = doc.querySelector('#imageId');

不依赖DOM中的元素，因为查询调用的根位于（分离的）div。这仍然会给您留下将该div附加到文档的位置和方式的（超出范围）问题。
querySelector
可以找到图像。为什么不使用
image=document.createElement（'img'））
然后从那里开始？@AleksG或更好的方法
image=newimage（）
@Alnitak indeedI刚刚做了，但图像为空now@NongthonbamTonthoi那么你就有别的错误了。啊，对了——在元素被插入DOM之前，你实际上找不到它。那么我该怎么做呢？这取决于你想把它放在哪里，但是如果这是Angular指令的一部分，它就超出了这个问题的范围