본문 텍스트에서 단어 교체
HTML 본문 내에 배치 된 테이블 요소 내의 일반 텍스트를 대체하는 방법이 있습니까?
"hello"를 "hi"로 바꾸시겠습니까?
jQuery 없이 JavaScript 만 사용하십시오 .
HTML의 문자열을 다른 문자열로 바꾸려면 innerHTML 의 replace 메서드를 사용하십시오 .
document.body.innerHTML = document.body.innerHTML.replace('hello', 'hi');
이것은 hello
HTML 코드의 모든 인스턴스 (예 : 클래스 이름 등)를 포함하여 본문 전체 의 첫 번째 인스턴스를 대체 하므로주의하여 사용하십시오. 더 나은 결과를 얻으려면 다음을 사용하여 코드를 대상으로 지정하여 대체 범위를 제한하십시오. document.getElementById 또는 유사합니다.
대상 문자열의 모든 인스턴스를 바꾸려면 g
lobal 플래그가 있는 간단한 정규식을 사용하십시오 .
document.body.innerHTML = document.body.innerHTML.replace(/hello/g, 'hi');
아래 기능은 저에게 완벽하게 작동합니다.
// Note this *is* JQuery, see below for JS solution instead
function replaceText(selector, text, newText, flags) {
var matcher = new RegExp(text, flags);
$(selector).each(function () {
var $this = $(this);
if (!$this.children().length)
$this.text($this.text().replace(matcher, newText));
});
}
다음은 사용 예입니다.
function replaceAllText() {
replaceText('*', 'hello', 'hi', 'g');
}
$(document).ready(replaceAllText);
$('html').ajaxStop(replaceAllText);
다음과 같이 직접 대체를 사용할 수도 있습니다.
document.body.innerHTML = document.body.innerHTML.replace('hello', 'hi');
그러나 태그, CSS 및 스크립트에도 영향을 미칠 수 있으므로주의하십시오.
편집 : 순수한 JavaScript 솔루션의 경우 대신이 방법을 사용하십시오.
function replaceText(selector, text, newText, flags) {
var matcher = new RegExp(text, flags);
var elems = document.querySelectorAll(selector), i;
for (i = 0; i < elems.length; i++)
if (!elems[i].childNodes.length)
elems[i].innerHTML = elems[i].innerHTML.replace(matcher, newText);
}
나는 같은 문제가 있었다. innerHTML에서 replace를 사용하여 내 자신의 함수를 작성했지만 앵커 링크 등을 망칠 것입니다.
제대로 작동하도록 라이브러리 를 사용 하여이 작업을 수행했습니다.
라이브러리에는 멋진 API가 있습니다. 스크립트를 포함시킨 후 다음과 같이 호출했습니다.
findAndReplaceDOMText(document.body, {
find: 'texttofind',
replace: 'texttoreplace'
}
);
나는 부작용없이 안전하게 텍스트를 대체하기 위해이 함수를 사용했다.
function replaceInText(element, pattern, replacement) {
for (let node of element.childNodes) {
switch (node.nodeType) {
case Node.ELEMENT_NODE:
replaceInText(node, pattern, replacement);
break;
case Node.TEXT_NODE:
node.textContent = node.textContent.replace(pattern, replacement);
break;
case Node.DOCUMENT_NODE:
replaceInText(node, pattern, replacement);
}
}
}
16kB가 findAndReplaceDOMText
너무 무거운 경우입니다.
Use the default javascript string replace function
var curInnerHTML = document.body.innerHTML;
curInnerHTML = curInnerHTML.replace("hello", "hi");
document.body.innerHTML = curInnerHTML;
I was trying to replace a really large string and for some reason regular expressions were throwing some errors/exceptions.
So I found this alternative to regular expressions which also runs pretty fast. At least it was fast enough for me:
var search = "search string";
var replacement = "replacement string";
document.body.innerHTML = document.body.innerHTML.split(search).join(replacement)
src: How to replace all occurrences of a string in JavaScript?
Try to apply the above suggested solution on pretty big document, replacing pretty short strings which might be present in innerHTML or even innerText, and your html design becomes broken at best
Therefore I firstly pickup only text node elements via HTML DOM nodes, like this
function textNodesUnder(node){
var all = [];
for (node=node.firstChild;node;node=node.nextSibling){
if (node.nodeType==3) all.push(node);
else all = all.concat(textNodesUnder(node));
}
return all;
}
textNodes=textNodesUnder(document.body)
for (i in textNodes) { textNodes[i].nodeValue = textNodes[i].nodeValue.replace(/hello/g, 'hi');
`and followingly I applied the replacement on all of them in cycle
I am new to Javascript
and just started learning these skills. Please check if the below method is useful to replace the text.
<script>
var txt=document.getElementById("demo").innerHTML;
var pos = txt.replace(/Hello/g, "hi")
document.getElementById("demo").innerHTML = pos;
</script>
참고URL : https://stackoverflow.com/questions/5558613/replace-words-in-the-body-text
'Program Tip' 카테고리의 다른 글
다항식 모델을 R의 데이터에 맞추기 (0) | 2020.10.07 |
---|---|
Android 호환성 패키지에는 Activity.getFragmentManager ()가 포함되어 있지 않습니다. (0) | 2020.10.07 |
EL 빈 연산자는 JSF에서 어떻게 작동합니까? (0) | 2020.10.07 |
MongoDB를 사용하여 하위 문서에서 배열을 필터링하는 방법 (0) | 2020.10.07 |
Hadoop없이 Apache Spark를 실행할 수 있습니까? (0) | 2020.10.07 |