728x90
-replace, replaceAll(문자열A,문자열B)
ex) 문자열C.replace(문자열A,문자열B); 은 , 문자열C내부의 문자열A를 문자열B로 치환하여 결과를 반환합니다.
-innerHTML
문자열내에 html태그가 있을 경우 , html태그는 HTML로 파싱하여준다.
하단은 통합검색시 이용하는 자바스크립트 명령어로 , 입력한 텍스트(inputText)를 색칠 해준다.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
function colorizeText(inputText, inputType) {
/*select specified things*/
var items;
if (inputType == "subject") {
items = document.getElementsByClassName("subject");
} else if (inputType == "all") {
items = document.getElementsByClassName("all");
} else if (inputType == "name") {
items = document.getElementsByClassName("name");
} else {
return;
}
for (var i = 0; i < items.length; i++) {
var item_text = items[i].textContent;
item_text = item_text.replaceAll(inputText,
'<span style="background-color:#F4F895;">'
+ inputText + '</span>');
items[i].innerHTML = item_text;
}
}
|
cs |
하단은 검색으로 1을 입력 해보았을 경우이다.
'21년이전 > front-end' 카테고리의 다른 글
| html - disabled , readOnly 의 차이 (0) | 2021.06.06 |
|---|---|
| js - 숫자 앞에 0을 붙이기 (0) | 2021.06.06 |
| js - var, let , const (0) | 2021.06.06 |
| front - jquery ajax (동기식) (0) | 2021.06.04 |
| front - modal (0) | 2021.06.04 |
