前端开发者| 做web前端开发需要什么技术 |
| web前端开发用什么工具包 |
| 前端开发产业是指什么意思 |
html 代码片段
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″ />
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″ />
<meta http-equiv=”X-UA-Compatible” content=”ie=edge” />
<title>Document</title>
</head>
<body>
<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>
$(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>双引号"""</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>
</body>
</html>
| 前端开发和什么打交道 |
| 前端开发项目是什么意思 |
| web前端开发需考什么证书 |
970106_lzh 2年前 (2021-01-08)说：
huihui 3年前 (2020-10-20)说：
Satisfy 3年前 (2020-06-05)说：
评论前必须登录！
注册