在KotlinJS中使用标准HTML元素可以安全地输入

我试图动态创建一个图像,然后我将附加到DOM。

import org.w3c.dom.HTMLImageElement fun main(args: Array<String>) { // load footer banner image val img: HTMLImageElement = HTMLImageElement() with (img){ src = "img/footer.png" classList.add("img-responsive") } } 

但是,它不喜欢我的构造函数HTMLImageElement()因为HTMLImageElement是一个接口。

删除构造函数和Kotlin抱怨img必须被初始化。

什么是以类型安全的方式使用HTMLImageElement的正确方法?

更新 :我现在正在使用maven生成所有的应用程序。

 <?xml version="1.0" encoding="UTF-8" standalone="no"?> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd"> <modelVersion>4.0.0</modelVersion> <groupId>com.blah</groupId> <artifactId>blah</artifactId> <packaging>jar</packaging> <version>1.0.0</version> <name>Blah</name> <properties> <kotlin.version>1.0.2</kotlin.version> <kotlin.html.version>0.5.8</kotlin.html.version> </properties> <repositories> <repository> <id>bintray-kotlinx</id> <name>bintray</name> <url>http://dl.bintray.com/kotlinx/kotlinx</url> </repository> </repositories> <dependencies> <dependency> <groupId>org.jetbrains.kotlinx</groupId> <artifactId>kotlinx.html.js</artifactId> <version>${kotlin.html.version}</version> </dependency> </dependencies> </project> 

编译blah.jsblah.js.mapblah.js.metakotlin.jskotlinx.html.jskotlinx.html.meta.jskotlinx.html.shared.jskotlinx.html.shared.meta.jsstdlib.meta.js

在我的html文件(这是坐在我的根目录),我包括以下内容:

 <script type="text/javascript" src="js/jquery-1.12.4.js"></script> <script type="text/javascript" src="js/bootstrap.js"></script> <script type="text/javascript" src="target/classes/kotlin.js"></script> <script type="text/javascript" src="target/classes/kotlinx.html.shared.js"></script> <script type="text/javascript" src="target/classes/blah.js"></script> 

我在我的Main.kt有一个println("hello world") ,它在浏览器的浏览器中在浏览器控制台中打印“hello world”。

现在我仍然想要使用Kotlin动态地添加该图像…

该文档说我应该做document.create.div("panel")创建一个div ,但document.create... autocompletes createAttributecreateComment等,没有create()方法在视线的任何地方。 (文档来自包“kotlin.browser”)。

我不确定如何使用kotlinx.html因为我在IntelliJ中看到的不匹配文档。

如何使用KotlinJS将动态创建的图像附加到现有的div上?

我只是用kotlin2jskotlinx.html IRus / kotlin-kotlinx.html编写示例项目。 看起来像kotlinx.html (0.5.8)的当前版本不兼容Kotlin 1.0.2,但与kotlin 1.0.1-2很好。