自定义控件与代码控件的使用

简单的使用自定义控件和代码控件实现一些场景

添加一个代码控件、一个自定义控件，在代码控件通过javascript代码编码，点击运行，将运行结果展示在自定义控件，点击添加的“提交”按钮，将输入框信息传java插件，弹出提示框

1、结构图

2、效果图

3、设计页面如下

4、插件部分代码如下

5、自定义控件的index.js的部分代码如下

6、代码控件输入的javascript代码如下

     function createSome() {
       var d=document.getElementById("codecontent");
        var la=document.createElement("label");
        var s=document.createElement("span");
        var dtext=document.createElement("div");
        var itext=document.createElement("input");
        var dmsg=document.createElement("div");
        var hmsg=document.createElement("h6");
        var btn = document.createElement("button");
        btn.setAttribute("id","submit_btn");
        btn.setAttribute("class","submit_btn_class");
        btn.style.width = "100px";
        btn.style.height = "30px";
        btn.innerHTML="提交";
        itext.setAttribute("id","username");
        la.setAttribute("class","form-label col-xs-3");
        s.setAttribute("class","c-red");
        s.append("*");
        la.appendChild(s);
        la.append("登录用户名");
        dtext.appendChild(itext);
        dmsg.appendChild(hmsg);
        d.appendChild(la);
        d.appendChild(dtext);
        d.appendChild(dmsg);
        d.appendChild(btn);
     }
createSome();

欢迎改造【emoji】