JavaScript에서 HTML로 텍스트 바꾸기

jQuery를 사용하지 않고 자바 스크립트 프로그램을 작성하여 페이지 기능을 엉망으로 만들지 않고 웹 페이지의 보이는 모든 대상 텍스트를 바꾸려고합니다.JavaScript에서 HTML로 텍스트 바꾸기

특히 페이스 북과 같은 사이트에서 수동으로 수행하는 Chrome 확장 프로그램을 만들려고합니다.

나는 다음과 같이 제한적인 성공을 경험했습니다

checkLoad(); 
function checkLoad(){ 
    if (document.readyState === "complete") { 
     document.body.innerHTML = document.body.innerHTML.replace("target string", "replacement string"); 
    } else { 
     setTimeout('checkLoad();', 500) 
    } 
}

이 코드는 사람의 이름, 제목 및 같은 것들을 벗어났습니다.

저는 둘러 보았는데 해결 방법을 찾지 못하는 것 같습니다. 어떤 아이디어?

출처

2012-11-25 Andrew

누락 된 내용의 예를 들려 줄 수 있습니까? 예를 들어 AJAX를 통해로드 된 항목 인 경우 계속 확인하는 경우가 아니면 놓칠 수 있습니다. –

여러 가지 이유로 'innerHTML'을 사용하지 않는 것이 좋습니다. HTML 태그와 속성의 내용을 수정하는 위험이 있습니다. –

Javascript 함수 .replace는 첫 번째 인수로 정규식을 사용합니다. 첫 번째 인수를 해당 정규 표현식 버전으로 바꾸어보세요 (예 : 모든 정규식 특수 문자를 이스케이프 처리). – MadSkunk

간단한 정규 표현식은 그것을 해결하기 위해 :

document.body.innerHTML = document.body.innerHTML.replace(/target string/g, "replacement string");

출처

2012-11-25 03:48:55

innerHTML로 내 문제를 해결했습니다. 고맙습니다. 명백하게 이것은 더 이상 내 문제에 대한 올바른 접근법이 아니지만 미래에 대해 알기 쉽습니다. – Andrew

이 접근법의 한 가지 문제점은 자바 스크립트 이벤트 처리기를 DOM에서 바인딩 해제한다는 것입니다. –

경고 - 전체 문서를 새로 고침하여 Chrome 확장 프로그램에서 발생한 모든 이벤트가 다시 열리는 것으로 보입니다. 방금 문제를 발견 했으므로 해결 방법을 찾지 못했습니다. 이건 우주에있는 다른 사람 한테는 영향을 미칩니다. –

나는이 블로그에서 몇 가지 이유에 대해 innerHTML을 교체에 대해 권하고 싶습니다

(https://j11y.io/javascript/replacing-text-in-the-dom-solved/를)

당신은 보장 할 수 없습니다 대체 된 텍스트는 텍스트입니다. 어쩌면 그것은 HTML 또는 다른 관련 코드의 속성입니다.
문서를 재설정하고 내 경우 크롬 확장을 다시 시작합니다. 이것은 나의 확장에 를 몇 번이고 다시로드하게했다.

나는 블로그에서 JS 파일을 다운로드하여이 문제를 해결 등처럼 전화 :

이

var regex = new RegExp(targetString, "g"); 
    findAndReplaceDOMText(document.body, { 
    find: regex, 
    replace: function(portion) { 
     var e = document.createElement('span'); 
     e.appendChild(document.createTextNode(replacementString)); 
     return e; 
    } 
    });

내 사용 사례는 위의 span 태그에 대체 텍스트를 감싸고, 그래서 당신보다 약간 다르다 . 이 자바 스크립트 함수에는 많은 유연성이 있습니다.

출처

2017-03-02 19:47:31

JavaScript에서 HTML로 텍스트 바꾸기

답변

관련 문제