javascript - 来自输入字段时如何通过 javascript 函数设置文本样式

Question

我有一个输入字段，可以帮助一个人进行对话，同时在对话中扮演两个 Angular 色。我想尽可能接近文本对话的感觉，但我似乎无法弄清楚如何在文本对话时设置文本样式。

目前，用户键入文本并点击两个按钮之一，每个按钮都加载了以下函数来拉取文本、创建 div、文本节点、将它们附加并放置在页面中。

我尝试对初始输入进行样式设置，但这只是使输入字段样式化，不会影响实际输出。

我尝试在每一步添加样式，添加到保存输入的变量、p、div、文本节点，以及将其放入文档后...每次函数失败时。

我尝试了属性方法和innerhtml方法。

什么会起作用？至少我喜欢粗体和右对齐文本的功能。接下来最好的方法是在它后面附加 ng-app 的内容，这样它会显示“我:(此处为文本)”，然后是“我 future 的自己:(此处为文本)”...我觉得这只会涉及一个设置为变量的字符串。 .但是设置 x = {{name}} 导致函数失败..

我知道有一种方法可以使用 firebug 来理解这些失败，但我还不太明白。有什么建议吗？

<script>




function changeTextComment4(destination){ 
// to be modified from the above to change the location of the dump
// this function ADDS a comment from the comment field to the div w id comment near it... 

var userInput = document.getElementById('userInputS1').value;  
// get the input from the user

// 3 make the div a panel

var para = document.createElement("P");
// assignment of attributes

var t = document.createTextNode(userInput);
para.appendChild(t);  


// add comment area

// place the item
var destination = document.getElementById(destination)
destination.insertBefore(para, destination.firstChild);

document.getElementById('userInputS1').value = "";
document.getElementById('userInputS1').focus();}

</script>

Answer 1

可以引用选择器添加样式

#userInputS1{
    color : #F00;
}