Javascript 如何在Chrome48中直接使用画布作为CSS背景？

Chrome48删除了JavaScriptAPI:document.getCSSCanvasContext（“2d”、id、宽度、高度）和CSS API:--webkit画布（id）。我能够在chrome以前的版本上运行webkit inspector，但在48版上无法运行

一些代码使用这些API在CSS中使用画布指定元素背景图像，并在javascript中绘制画布，如下所示：

const context=document.getCSSCanvasContext（“2d”，背景画布，50,50）；
context.fillStyle=“rgb（255,0,0）”；
ctx.fillRect（0,0,50,50）
.container{
宽度：50px；
高度：50px；
边框：1px纯红；
背景图像：-webkit画布（背景画布）；
}
我不知道这个API，但是如果你需要js，我看不出这个CSS画布比真正的HTMLCanvasElement有什么优势。EventListener很容易添加，调整大小也不难。您能告诉我们，使用这种仅由几个版本的单浏览器API支持的真正优势是什么吗？我敢肯定，只要几行高度支持的js就可以重现它。我需要：1）生成的图像（a和B）作为元素的背景图像。2） 使用CSS选择器从A和B中选择背景。CSS擅长通过不同的类和不同的嵌套关系，使用其选择器解决复杂情况。它可以定义复杂的规则来确定应该使用哪个图像作为背景。我认为解决方案是：1）使用HTMLCanvasElement和JS事件处理程序以及dataUrl设置背景。缺点：它不能使用CSS选择器，并且必须编写许多JS条件。或者2）插入多个HTMLCaseElement并使用CSS。缺点：js初始化