122 lines
3.2 KiB
HTML
122 lines
3.2 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>
|
|
</head>
|
|
<style>
|
|
* {
|
|
list-style: none;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
}
|
|
</style>
|
|
<body>
|
|
<input type="text" placeholder="请输入关键字">
|
|
<ul>
|
|
|
|
</ul>
|
|
</body>
|
|
<script>
|
|
// var keyword = ['今天天气不好', '今天很开心', '大事不好', '我不开心', '天气很一般'];
|
|
// var newWord = [];
|
|
// $("input").oninput = function () {
|
|
// if ($("input").value.length != 0) {
|
|
// newWord = []
|
|
// keyword.forEach(function (v) {
|
|
// if (v.includes($("input").value)) {
|
|
// var news =v.replaceAll(
|
|
// $("input").value,
|
|
// `<span style="color:red;">${ $("input").value}</span>`
|
|
// )
|
|
// newWord.push(news)
|
|
// }
|
|
// });
|
|
// renderLi()
|
|
// }
|
|
// }
|
|
|
|
|
|
|
|
|
|
// function renderLi() {
|
|
// $("ul").innerHTML = ""
|
|
// newWord.forEach(function (v) {
|
|
// $("ul").innerHTML +=`<li>${v}</li>`
|
|
// })
|
|
// }
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// var keyword = ['科比', '科比球星', '詹姆斯', '詹姆斯球星', '科比不错', '詹姆斯不错', '霍华德', '霍华德球星', '霍华德不错']
|
|
// var newWord = []
|
|
|
|
|
|
|
|
|
|
// $("input").oninput = function () {
|
|
// if ($("input").value.length != 0) {
|
|
// newWord = []
|
|
// keyword.forEach(function (v) {
|
|
// if (v.includes($("input").value)) {
|
|
// var news=v.replaceAll(
|
|
// $("input").value,
|
|
// `<span style="color:blue;">${$("input").value}</span>`
|
|
// )
|
|
// newWord.push(news)
|
|
// }
|
|
// });
|
|
// dis()
|
|
// }
|
|
// }
|
|
|
|
// function dis() {
|
|
// $("ul").innerHTML=""
|
|
// newWord.forEach(function (v) {
|
|
// $("ul").innerHTML+=`<li>${v}</li>`
|
|
// })
|
|
// }
|
|
|
|
|
|
|
|
var keyword = ['科比', '科比球星', '詹姆斯', '詹姆斯球星', '科比不错', '詹姆斯不错', '霍华德', '霍华德球星', '霍华德不错']
|
|
var newWord = []
|
|
|
|
$("input").oninput=function () {
|
|
if ($("input").value.length !=0) {
|
|
newWord = []
|
|
keyword.forEach(function (v) {
|
|
if (v.includes($("input").value)) {
|
|
var news=v.replaceAll(
|
|
$("input").value,
|
|
`<span style="color:red;">${$("input").value}</span>`
|
|
)
|
|
newWord.push(news)
|
|
}
|
|
});
|
|
app ()
|
|
}
|
|
}
|
|
|
|
|
|
function app () {
|
|
$("ul").innerHTML=""
|
|
newWord.forEach(function (v) {
|
|
$("ul").innerHTML+= `<li>${v}</li>`
|
|
})
|
|
}
|
|
|
|
|
|
function $(className) {
|
|
return document.querySelector(className)
|
|
}
|
|
</script>
|
|
|
|
</html> |