自动生成html代码
我不知道如何框架标题，希望你们能理解我的问题。我正在寻找一些简单的替代方法，而不是手动替换横幅HTML代码中的文本。自动生成html代码
对于例 - 下面的代码
<a class="fragment" href="https://applink" target="_blank">
<div>
<img class="imgbor" src ="https://static.geenapp.com/appromo/1250-100.png" alt="some description"/>
<span class="styleraise">App Name</span><span class="styleraise1">Price 0.99$</span>
<div class="textpara">
App description</div>
</div>
</a>我期待这样的事情时，我填写了一些文字（我在Photoshop中创建的这个）
所以在框中，它改变了HTML代码。我需要创建100个这样的横幅，这样很容易。 也许任何在线服务或脚本可以帮助我实现这一目标。
下面是简单的HTML表单，它反应在每个输入改变，并产生您所需的HTML：
$(function() {
\t $("input[type=text]").on("input", function() {
\t var app = $("[name=app]").val();
var desc = $("[name=desc]").val();
var imglink = $("[name=imglink]").val();
var applink = $("[name=applink]").val();
var price = $("[name=price]").val();
$("#output").get(0).innerHTML = $('<div/>').text('<a class="fragment" href="' + applink + '" target="_blank"> \
<div> \
<img class="imgbor" src="' + imglink + '" alt="some description" /> \
<span class="styleraise">' + app + '</span> \
<span class="styleraise1">' + price + '</span> \
<div class="textpara">' + desc + '</div> \
</div> \
</a>').html();
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
App name<br>
<input name="app" type="text"/><br>
App description<br>
<input name="desc" type="text"/><br>
Image link<br>
<input name="imglink" type="text"/><br>
App link<br>
<input name="applink" type="text"/><br>
Price<br>
<input name="price" type="text"/><br>
<code id="output"></code>很好的答案。如果OP有选择，情况会好得多。使用模板文字是更干净的代码，但古代浏览器将不被支持或OP可以使用您创建的样式。 –
我建议你建立一个小的Web应用程序在后台这个小工具： https://docs.python.org/2/library/htmlparser.html
基本上，你想要做的是相应地更新所需的值，然后将文件流保存到新文件。 （您可以添加增量ID，这样你会得到“文件1.HTML”，“文件2.HTML”等）
但确定有很多其他的选择暗示模板系统。 最近我不得不用一个XML文件执行类似的任务，我在NodejS后端（使用python）（这个解析器）[https://docs.python.org/2/library/xml.etree.elementtree.html]作为一种“CGI”）和前端的ReactJS。但是你可以按照你的意愿去做。 –
最新情况： JSFiddle
这是一个React的巨大用例！访问他们的docs并按照沿tutorial
反应过来的时候，你要创造数千个类似寻找组件特别有效。
例如，您的代码看起来像这样 -
class Fragment extends React.Component {
render() {
return (
<a class="fragment" href="https://applink" target="_blank">
<div>
<img class="imgbor" src={this.props.src} alt="some description" />
<span class="styleraise">App Name</span>
<span class="styleraise1">Price 0.99$</span>
<div class="textpara">App description</div>
</div>
</a>
);
}
}
您可以在父组件中重复该组件多次，只要您想要。 React对于可重用性非常好。
您需要首先尝试的东西，然后问一个具体问题。否则，这将被视为offtopic，应该被关闭。阅读http://stackoverflow.com/help/how-to-ask和http://stackoverflow.com/help/mcve –