输出HTML代码

时间:2015-08-23 03:40:55

标签: javascript html

我正在尝试制作一个简单的代码来帮助一些同事。基本上我希望他们能够输入2个输入并具有html代码输出。例如:

输入1 =玉米

输入2 =好吃

output = <font color="#987654" face="Helvetica, Arial, sans-serif">corn</font>delicious

当前输出只是将html样式添加到第一个输入。任何建议将不胜感激。干杯!

<head>
  <title></title>

  <style>
  #prod_name { height: 30px; width:700px; }
  #prod_desc { height: 30px; width:700px; padding-top:15px; }

  </style>

</head>

<body>

Title: <input id="prod_name"><br />
Description: <input id="prod_desc"><br />
<button id="convert">Convert to HTML</button>

<hr>

<div id="result"></div>

<script>
function convert_it() {
    var proname = document.getElementById('prod_name').value;
    var descname = document.getElementById('prod_desc').value;

    var html = '<font color="#987654" face="Helvetica, Arial, sans-serif">'  + proname + '</font> ' + descname;

    document.getElementById('result').innerHTML = html;
}

document.getElementById('convert').addEventListener('click', convert_it);
</script>

</body>

0 个答案:

没有答案