动态创建JavaScript并将其用于输入type =“text”

Question

我创建了一个web应用程序，它可以通过输入type =“text”。来更改元素.App包含动态创建的CSS并且工作正常。但是，动态创建的Javascript doesn没有工作。如何在input type =“text”中启用动态创建的脚本并在发短信时运行更改值？我想输入document.body.style.color ='red';或提醒（“你好”）;并看到像CSS一样的变化。

var a = document.createElement("style"); 
a.type = "text/css"; 
document.body.appendChild(a); 

var b = document.createElement("script"); 
b.type = "text/javascript"; 
document.body.appendChild(b); 

function changeBackgrounds() { 

    document.body.style.color = document.querySelector("#r").value; 
    document.body.style.fontStyle = document.querySelector("#r").value; 
    document.querySelector(".p").innerHTML = document.getElementById("r").value; 
    document.body.style.backgroundImage = document.querySelector("#r").value; 
    document.querySelector("video.video2").style.transition = document.querySelector("#r").value; 
    document.querySelector("video.video3").style.animation = document.querySelector("#r").value; 

    a.innerHTML = document.querySelector("#r").value; 
    b.innerHTML = document.querySelector("#r").value; 

    document.body.style.overflow = document.querySelector("#r").value; 
    document.body.style.textDecoration = document.querySelector("#r").value; 
    document.body.style.animation = document.querySelector("#r").value; 

} 

Answer 1

问：

我想的JavaScript输入到输入并立即执行。

以下是您要求的简单版本，我认为。

路线：

只需键入一些JavaScript到textarea的，看着它执行。例如输入：textarea.style.borderColor = 'red';（不要复制&粘贴，输入你想要的）。如果您愿意，您可以改进语句检测，正如我所说的，这是一个简单的版本。

答：

var textarea = document.getElementById('textarea'); 
 

 
textarea.onkeydown = (e) => { 
 
    // Statement detection 
 
    if(e.keyCode === 186) { 
 
    execute(textarea.value); 
 
    } 
 
} 
 

 
function execute(text) { 
 
    var script = new Function(text); 
 
    return(script()); 
 
}

textarea { 
 
    height: 100px; 
 
    width: 200px; 
 
}

<textarea id="textarea"></textarea>