60 lines
1.3 KiB
HTML
60 lines
1.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Document</title>
|
|
<style>
|
|
span {
|
|
color: brown;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<input type="text">
|
|
<ul>
|
|
<li></li>
|
|
</ul>
|
|
</body>
|
|
<script>
|
|
function $(name) {
|
|
return document.querySelector(name);
|
|
}
|
|
function _(name) {
|
|
return document.querySelectorAll(name);
|
|
}
|
|
let date = ["就会加快", "摄氏度", "的方式三", "第三个", "加规划图", "公司的",]
|
|
let sss = []
|
|
$("input").oninput = function () {
|
|
sss = []
|
|
if ($("input").value.length != 0) {
|
|
|
|
date.forEach(function (v) {
|
|
|
|
if (v.includes($("input").value)) {
|
|
let ddfg = v.replaceAll($("input").value, `<span>${$("input").value}</span>`)
|
|
sss.push(ddfg)
|
|
}else{
|
|
// $("ul").innerHTML = ""
|
|
}
|
|
|
|
})
|
|
dds();
|
|
} else {
|
|
$("ul").innerHTML = ""
|
|
}
|
|
|
|
}
|
|
|
|
function dds() {
|
|
sss.forEach(function (c) {
|
|
$("ul").innerHTML = ""
|
|
$("ul").innerHTML += `<li>${c}</li>`;
|
|
})
|
|
}
|
|
</script>
|
|
|
|
</html> |