通过页面输入框，来控制页面字的样式

我想做个文本框输入来控制页面CSS的样式，大家可以参考图片

做了个样例，参考这个写。
[code="html"]

<!-使用在线的jquery--> $(function(){ //<!-给button绑定click事件--> $("#buttonP").click(function(){ var idP = $("#idP");//<!-获取需要修改的元素--> //<!-获取输入的css样式--> var cssStr = $.trim($("#cssInput").val()); var arr = cssStr.split(";");//<!-多个样式分开成保存数组中--> $.each(arr,function(){ if(this!=""){//<!-数组最后一个元素可能为空--> var arrElements = this.split(":");//<!-将属性和值分开--> //<!-设置样式--> idP.css(arrElements[0],arrElements[1]);} }); }); });

test

<!- 为了修改p的样式，请在输入样式-->




[/code]

可以这样子输入：
font-size:10px;
也可以多个样式：
font-size:10px;
color:red;
font-family:Arial, sans-serif, Helvetica, Tahoma;