Удаление пустых узлов DOM
Всем привет, в JS новичок и вот задумался, как можно удалить все пустые узлы на HTML странице.
Написал скрипт - удаляет пустые узлы проходя по firstChild узлам. Есть условие поднятия на уровень выше, если кончились узлы для проверки. Но он почему-то не работает. Советы по кодированию приветствуются. Проверяю в FF.
window.onload = function() {
var body = document.body;
var k = 0;
function del_empty_nodes(obj) {
if ((obj.childNodes.length != 0) && (obj.childNodes.length != 1)) {
for (var i = 0; i < obj.childNodes.length; i++) {
if (obj.childNodes[i] instanceof Text) {
obj.removeChild(obj.childNodes[i]);
}
}
del_empty_nodes(obj.firstChild);
}else {
if (obj.nextSibling.nodeType == 1) {
del_empty_nodes(obj.nextSibling);
}
if (obj.parentNode == document.body) {
return;
}
if (obj.parentNode.nextSibling.nodeType == 1) {
var obj = obj.parentNode.nextSibling;
del_empty_nodes(obj);
}else {
var obj = obj.parentNode.parentNode;
del_empty_nodes(obj.nextSibling);
}
}
}
del_empty_nodes(body);
}
<div id="div"> <form action="#" method="POST" id="form"> <input type="radio" name="rad_1" onclick="selThis(this)"/> <input type="radio" name="rad_2" onclick="selThis(this)"/> <input type="radio" name="rad_3" onclick="selThis(this)"/> </form> <div> <p>Новый блок</p> <p>Новый блок</p> <p>Новый блок</p> </div> </div> <p>11111111111111111111111111111111111111</p> |
Сергей_46,
а что по вашему пустой узел? |
Сергей_46, вот http://learn.javascript.ru/traversing-dom#children и не страдайте фигней .
|
<div></div><div></div><div></div><div></div><input />
<script>
alert('сейчас пустых элементов всего: ' + document.querySelectorAll('body :empty').length);
var emptyElements = document.querySelectorAll('body :empty');
for(var i = emptyElements.length, elem; elem = emptyElements[--i];) {
elem.parentNode && elem.parentNode.removeChild(elem);
}
alert('Осталось пустых элементов всего: ' + document.querySelectorAll('body :empty').length);
</script>
|
devote,
а если так ?
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div><div></div><div></div><div></div><div></div></div><input />
<script>
alert('сейчас пустых элементов всего: ' + document.querySelectorAll('body :empty').length);
var emptyElements = document.querySelectorAll('body :empty');
for(var i = emptyElements.length, elem; elem = emptyElements[--i];) {
elem.parentNode && elem.parentNode.removeChild(elem);
}
alert('Осталось пустых элементов всего: ' + document.querySelectorAll('body :empty').length);
</script>
</body>
</html>
|
Цитата:
что-то типо:
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div><div></div><div></div><div></div><div></div></div><input />
<script>
alert('сейчас пустых элементов всего: ' + document.querySelectorAll('body :empty').length);
for(var elem; elem = document.querySelector('body :empty'); ) {
elem.parentNode.removeChild(elem);
}
alert('Осталось пустых элементов всего: ' + document.querySelectorAll('body :empty').length);
</script>
</body>
</html>
|
devote,
ок ) только считатьли инпут или картинку пустым узлом вот вопрос? |
Исключить IMG, INPUT
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div><div></div><div></div><div></div><div></div></div><input />
<script>
alert('сейчас пустых элементов всего: ' + document.querySelectorAll('body :empty:not(img):not(input)').length);
for(var elem; elem = document.querySelector('body :empty:not(img):not(input)'); ) {
elem.parentNode.removeChild(elem);
}
alert('Осталось пустых элементов всего: ' + document.querySelectorAll('body :empty:not(img):not(input)').length);
</script>
</body>
</html>
|
рони,
devote, можно удалить все узлы, но зачем? или у вас спортивный интерес?) |
| Часовой пояс GMT +3, время: 15:24. |