原生js动态注入脚本内容

export  const createScript = (result,type,pos) =>{

        var positions = pos? document.getElementsByTagName('head')[0] :document.getElementsByTagName('body')[0]

        var script = document.createElement('script')

        script.type = 'text/javascript'

        if (type === 'url') {

            script.src = result

        } else {            

            script.innerHTML = result

        }

        positions.appendChild(script)

    }

let scriptCode = `

            function fns(){

                alert("原生js动态注入脚本内容")

            }

            fns()

createScript(scriptCode)          

想要在页面动态添加元素，首先要确定在哪个元素后面添加元素，然后利用js的appendChild方法在该元素后面追加元素。

1.获取父节点元素varbody=document.getElementsByTagName('body')[0]。

2.然后动态创建a标签vara=document.createElement('a')。

3.把创建好的a标签追加到body下面body.appendChild(a)。

4.在a标签里面添加文本内容a.innerHTML='这是一个链接'。

5.给a标签添加一个链接a.href='https://www.baidu.com/'。

扩展资料：

js一些原生方法

element.appendChild()方法向节点添加最后一个子节点。

element.innerHTML设置或返回元素的内容。

document.getElementsByTagName()返回带有指定标签名的对象集合。

document.getElementById()返回对拥有指定id的第一个对象的引用。

document.createElement()通过指定名称创建一个元素。

如果需要用原生js动态的加载另外一个js文件，可以使用原生js的document.createElement方法创建script节点，然后更改该节点的type和src属性,最后通过appendChild方法将该节点动态添加到html中，这样就可以了，参考代码如下：

var new_element = document.createElement("script")//创建新的script节点new_element.setAttribute("type", "text/javascript")new_element.setAttribute("src", "../js/jquery.js")document.body.appendChild(new_element)//添加到body节点的末尾

上例中是在body的最末尾添加的，当然同样可以在head中添加引用该js的标签：document.head.appendChild(new_element)

---