2014-11-30 3 views
2

Я хочу иметь функцию Javascript, которая удаляет каждый текст с сайта. Фон заключается в том, что для того, чтобы сравнить внешний вид рендеринга DOM в разностных браузерах, мне нужно прежде всего устранить очевидные различия. Поскольку рендеринг шрифтов является известным различием, я хочу удалить каждый текст. Решения, которые я нашел всегда были такими:Как удалить каждый текст с сайта с помощью Javascript

if(start.nodeType === Node.TEXT_NODE) 
{ 
    start.parentNode.removeChild(start); 
} 

Но это только удаляет чистые текстовые узлы. Я также хочу найти такие конструкции, как:

<div> 
     <p> 
      <em>28.11.2014</em> 
      <img></img> 
       Testtext 
      <span> 
       <i>Testtext</i> 
       Testtext 
      </span> 
     </p> 
    </div> 

Если элемент, содержащий текст, также содержит дочерние элементы или. Таким образом, элемент не распознается как текстовый узел.

Так что я в основном хочу, чтобы превратить выше DOM в этом:

<div> 
     <p> 
      <em></em> 
      <img></img> 
      <span> 
       <i></i> 
      </span> 
     </p> 
    </div> 

ответ

1

Вы можете попробовать что-то вроде этого.
Demo

HTML:

<div id="startFrom"> 
    <p> 
     <em>28.11.2014</em> 
      <img></img> 
      Testtext 
     <span> 
      <i>Testtext</i> 
      Testtext 
     </span> 
    </p> 
</div> 

JavaScript:

var startFrom = document.getElementById("startFrom"); 

function traverseDom(node) { 
    node = node.firstChild; 
    while (node) { 
     if (node.nodeType === 3) { 
      node.data = ""; 
     } 
     traverseDom(node); 
     node = node.nextSibling; 
    } 
} 

traverseDom(startFrom); 
console.log(startFrom); 
+0

Работает как очарование! Большое спасибо :-) – Schnodderbalken

1

Этот код ниже примерно проверяется, но вы можете попробовать поставить его в файл внешних .js и выполнить его из документ при нагрузке

function cleantxt() 
{ 
    var htmlsrc = document.documentElement.outerHTML; 
    var htmlnew = ''; 
    var istag = false; 
    for(i=0; i<htmlsrc.length; i++) { 
     if(htmlsrc.charAt(i)=='<') { 
      istag = true; 
      htmlnew = htmlnew + htmlsrc.charAt(i); 
     } 
     else if(htmlsrc.charAt(i)=='>') { 
      istag = false; 
      htmlnew = htmlnew + htmlsrc.charAt(i); 
     } 
     else if(istag) { 
      htmlnew = htmlnew + htmlsrc.charAt(i); 
     } 
    } 
    document.getElementsByTagName("html")[0].innerHTML = htmlnew + 'Cleaned'; // just a signature to see it works 
} 
+0

Последняя строка использует jQuery только потому, что я не нашел решение в простом Javascript сразу. Простите за это. –

+1

Функция выполняет то, что должна, но производительность не совсем идеальна, когда вы пересекаете строки узла DOM. Иметь мой голос в любом случае. – Schnodderbalken

+1

Спасибо. Я узнаю из другого ответа сейчас :-) –

1

Wi й JQuery .. DEMO

$('selecter').find("*").contents().filter(function() { 
    return this.nodeType == 3; 
}).remove(); 
+1

Также хорошее решение. Интересно, так быстро, как простое решение для JavaScript. Одна вещь об этом: вы должны позаботиться о iframe, когда вы выберете всю DOM. В противном случае вы столкнетесь с этим: DOMException: Не удалось прочитать свойство contentDocument из «HTMLIFrameElement»: заблокировал кадр с источником «http://www.example.com» от доступа к кадру с перекрестным началом. – Schnodderbalken