最小化 Javascript 和 HTML 代码
Minimizing Javascript and HTML code
我为我的客户开发了一个自定义工具,他们可以在其中向中央数据库提交反馈。
我有很长的 HTML 和 JavaScript 代码,客户将这些代码粘贴到他们的网站上,该工具出现在网站上。
我的问题是如何最小化这段代码?我见过只需要粘贴几行代码就出现在浏览器上的聊天工具。
下面是我的代码,我需要从中生成一小部分代码。
<div id='htmlfeedback-container-more'>
<a id='lnkdivFeedBackPage1' href='#'>FeedBack</a> | <a id='lnkdivFeedBackPage2' href='#'>Settings</a><br /><br />
<div id='divFeedBackPage1'>
<div id='content' class='content'></div>
<p>Please give a short description of your feedback. You can also highlight or blackout parts of the screen.</p>
<p>Note: Click on highlighted areas to disappear </p>
<form id='htmlfeedback-form'>
<p> <span>Marker:</span><input type='radio' name='marker' value='rgba(255,255,255,0)' style='width:10%' checked> Highlight <input type='radio' name='marker' value='rgb(0,0,0)' style='width:10%'> Black out </p>
<p><span>Name or E-mail:</span> <input type='text' name='email' id='htmlfeedback-input-email' style='width:88%'/></p>
<p><span>Short description:</span> <textarea name='description' id='htmlfeedback-input-description'></textarea></p>
<p><input type='submit' id='htmlfeedback-submit' value='Send' style='background-color:#5547ec'><input type='reset' id='htmlfeedback-reset' value='Reset' style='width:30%;background-color:#5547ec'></p>
</form></div>
<div id='divFeedBackPage2'>
<p>Changes will take effect through all the instances of the tool if you have added the control in multiple locations.</p>
<form id='frmfeedBackSettings-form'>
<p><span>Title:</span><input type='text' name='text' id='txtfeedBackTitle' style='width: 88%' /></p>
<p><span>Color:</span><input type='text' name='text' id='txtfeedBackColor' /></p>
<input type='submit' id='btnSubmitFeedbackSettings' value='Submit'/>
</form></div></div></div>
<div id='divWaitMsg' style='display:none; color:blue; font-size:20px' class='centered'>Please Wait....</div>
您可以让 js 代码将其注入到 dom 需要的地方,他们可以通过放置脚本标记来添加它。
<script src="feedback-form.js"></script>
反馈表将注入 html 内容。
有些人只用几行代码就可以完成您想要做的事情的方式是使用 HTML iFrame,
喜欢
<noscript>Enable Javascript to get full functionality of this <a href="http://www.freeshoutbox.net/">shoutbox</a><br /></noscript><iframe src="http://CodeLuca.freeshoutbox.net/" height="300" width="500" frameborder="0"></iframe>
或
<iframe width="560" height="315" src="https://www.youtube.com/embed/DBXZWB_dNsw" frameborder="0" allowfullscreen></iframe>
如果你想制作一个,你只需要在空白页上制作你的表单,然后制作一个链接到它的 iframe。
祝你好运!
卢卡
我为我的客户开发了一个自定义工具,他们可以在其中向中央数据库提交反馈。
我有很长的 HTML 和 JavaScript 代码,客户将这些代码粘贴到他们的网站上,该工具出现在网站上。
我的问题是如何最小化这段代码?我见过只需要粘贴几行代码就出现在浏览器上的聊天工具。
下面是我的代码,我需要从中生成一小部分代码。
<div id='htmlfeedback-container-more'>
<a id='lnkdivFeedBackPage1' href='#'>FeedBack</a> | <a id='lnkdivFeedBackPage2' href='#'>Settings</a><br /><br />
<div id='divFeedBackPage1'>
<div id='content' class='content'></div>
<p>Please give a short description of your feedback. You can also highlight or blackout parts of the screen.</p>
<p>Note: Click on highlighted areas to disappear </p>
<form id='htmlfeedback-form'>
<p> <span>Marker:</span><input type='radio' name='marker' value='rgba(255,255,255,0)' style='width:10%' checked> Highlight <input type='radio' name='marker' value='rgb(0,0,0)' style='width:10%'> Black out </p>
<p><span>Name or E-mail:</span> <input type='text' name='email' id='htmlfeedback-input-email' style='width:88%'/></p>
<p><span>Short description:</span> <textarea name='description' id='htmlfeedback-input-description'></textarea></p>
<p><input type='submit' id='htmlfeedback-submit' value='Send' style='background-color:#5547ec'><input type='reset' id='htmlfeedback-reset' value='Reset' style='width:30%;background-color:#5547ec'></p>
</form></div>
<div id='divFeedBackPage2'>
<p>Changes will take effect through all the instances of the tool if you have added the control in multiple locations.</p>
<form id='frmfeedBackSettings-form'>
<p><span>Title:</span><input type='text' name='text' id='txtfeedBackTitle' style='width: 88%' /></p>
<p><span>Color:</span><input type='text' name='text' id='txtfeedBackColor' /></p>
<input type='submit' id='btnSubmitFeedbackSettings' value='Submit'/>
</form></div></div></div>
<div id='divWaitMsg' style='display:none; color:blue; font-size:20px' class='centered'>Please Wait....</div>
您可以让 js 代码将其注入到 dom 需要的地方,他们可以通过放置脚本标记来添加它。
<script src="feedback-form.js"></script>
反馈表将注入 html 内容。
有些人只用几行代码就可以完成您想要做的事情的方式是使用 HTML iFrame,
喜欢
<noscript>Enable Javascript to get full functionality of this <a href="http://www.freeshoutbox.net/">shoutbox</a><br /></noscript><iframe src="http://CodeLuca.freeshoutbox.net/" height="300" width="500" frameborder="0"></iframe>
或
<iframe width="560" height="315" src="https://www.youtube.com/embed/DBXZWB_dNsw" frameborder="0" allowfullscreen></iframe>
如果你想制作一个,你只需要在空白页上制作你的表单,然后制作一个链接到它的 iframe。
祝你好运!
卢卡