html 代码片段
- <head>
- <title>js 拼接字符串工具 </title>
- <meta http-equiv="content-type" content="text/html;charset=utf-8">
- <style>
- body{background:#F6F6F6;font:12px 微软雅黑}
- section{width:1000px;padding:30px 0;margin:0 auto;}
- textarea{width:99%;border:1px solid #e6e6e6;height:220px;font-family:Verdana}
- p{font-size:14px;margin:5px;}
- div{margin:5px;}
- input[type=button]{border:none;background:#FF6100;color:#fff;padding:5px 20px;cursor:pointer}
- input[type=button]:hover{background:#FF863E}
- ::selection{color:#FFF;background:#FF6100}
- </style>
- <script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
- <script>
- $(function() {
- var $singleBtn = $("#singleQuote"),
- $doubleBtn = $("#doubleQuote"),
- $arrayChk = $("#arrayCheck"),
- $source = $("#source"),
- $result = $("#result");
- $source.mouseover(function() {
- this.focus();
- this.select();
- });
- $result.mouseover(function() {
- this.focus();
- this.select();
- });
- $singleBtn.click(function() {
- var isArrayCheck = $("#arrayCheck").prop("checked"),
- resultArr = getResult($source.val(), true, isArrayCheck);
- $result.val(resultArr.join(""));
- });
- $doubleBtn.click(function() {
- var isArrayCheck = $("#arrayCheck").prop("checked"),
- resultArr = getResult($source.val(), false, isArrayCheck);
- $result.val(resultArr.join(""));
- });
- });
- function getResult(source, isSingle, isToArray) {
- var sourceArr,
- resultArr = [],
- exp = /(\')|(\")|(\\)/g,
- value;
- sourceArr = $.trim(source).replace(exp,
- function(match, singleQuote, doubleQuote, backslash) {
- if (singleQuote) return isSingle ? "\\'": match;
- if (doubleQuote) return isSingle ? match: '\\"';
- if (backslash) return "\\\\";
- }).split('\n');
- if (isToArray) {
- resultArr.push("[");
- for (var i = 0, len = sourceArr.length; i <len; i++) {
- value = $.trim(sourceArr[i]);
- if (value !== "") {
- if (i === len - 1) {
- isSingle ? resultArr.push("\'" + value + "\'") : resultArr.push("\"" + value + "\"");
- } else {
- isSingle ? resultArr.push("\'" + value + "\',\n") : resultArr.push("\""+ value +"\",\n");
- }
- }
- }
- resultArr.push("].join(\"\");");
- } else {
- for (var i = 0, len = sourceArr.length; i < len; i++) {
- value = $.trim(sourceArr[i]);
- if (value !== '') {
- if (i === len - 1) {
- isSingle ? resultArr.push("\'" + value + "\';") : resultArr.push("\""+ value +"\";");
- } else {
- isSingle ? resultArr.push("\'" + value + "\'+\n") : resultArr.push("\""+ value +"\"+\n")
- }
- }
- }
- }
- return resultArr;
- }
- </script>
- </head>
- <section>
- <p > 要拼接的字符串:</p>
- <textarea id="source">
- <div id="container">
- <p> 单引号 '''</p>
- <p> 双引号 & quot;""</p>
- <p> 反斜杠加单引号 \'\'\'</p>
- <p> 反斜杠加双引号 \"\"\"</p>
- </div>
- </textarea>
- <div>
- <input id="singleQuote" type="button" value="单引号"/>
- <input id="doubleQuote" type="button" value="双引号"/>
- <input id="arrayCheck" type="checkbox" checked="checked"/> 数组拼接
- </div>
- <p > 拼接后的 js 代码:</p>
- <textarea id="result"></textarea>
- </section>
copy 网址: http://www.CSS88.com/tool/html2js/
来源: http://www.qdfuns.com/article/17398/16b5b6bb324439cbc1554acfed197b49.html