...

View Full Version : remove tag



rupert
07-16-2011, 09:00 AM
Hi all, here i got a problem, i want to remove all the Li tag that with a classname"test" .

<html>
<head>
<title>Introduction to the DOM</title>
<script>
window.onload = function(){
var li = document.getElementsByTagName("li");
for ( var j = 0; j < li.length; j++ ) {
if(li[j].getAttribute('class')=='test'){
li[j].parentNode.removeChild( li[j] );
}
}
};
</script>
</head>
<body>
<h1>Introduction to the DOM</h1>
<p class="test">There are a number of reasons why the
DOM is awesome, here are some:</p>
<ul>
<li class="ppp">ppp.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
</ul>
</body>
</html>

abduraooft
07-16-2011, 09:08 AM
Your code works in Firefox. If you are aiming IE too, use
if(li[j].className=='test') instead.

jmrker
07-16-2011, 03:17 PM
<html>
<head>
<title>Introduction to the DOM</title>
<script>
window.onload = function(){
var li = document.getElementsByTagName("li");
for ( var j = 0; j < li.length; j++ ) {
if(li[j].className=='test') { li[j].style.display = 'none'; }
}
};
</script>
<style type="text/css">
.test { list-style-type:none; }
</style>

</head>
<body>
<h1>Introduction to the DOM</h1>
<p class="test">There are a number of reasons why the
DOM is awesome, here are some:</p>
<ul>
<li class="ppp">ppp.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
</ul>
</body>
</html>


This seems to work in both MSIE and FF.

bullant
07-17-2011, 10:55 AM
if(li[j].className=='test') { li[j].style.display = 'none'; }



that only hides the elements. It doesn't "remove" them like the op wants.

@op

using abduraooft's suggestion in your code should work in all major browsers.

rupert
07-18-2011, 07:58 AM
<html>
<head>
<title>Introduction to the DOM</title>
<script>
window.onload = function(){
var li = document.getElementsByTagName("li");
for ( var j = 0; j < li.length; j++ ) {
if(li[j].className=='test') { li[j].style.display = 'none'; }
}
};
</script>
<style type="text/css">
.test { list-style-type:none; }
</style>

</head>
<body>
<h1>Introduction to the DOM</h1>
<p class="test">There are a number of reasons why the
DOM is awesome, here are some:</p>
<ul>
<li class="ppp">ppp.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
<li class="test">It's easy to use.</li>
<li class="test">It can help you to find what you want, really quickly.</li>
</ul>
</body>
</html>


This seems to work in both MSIE and FF.

yeah, it just hide them,but i want to remove all of them..

Krupski
07-18-2011, 04:54 PM
Hi all, here i got a problem, i want to remove all the Li tag that with a classname"test" .


Grab this function: http://code.google.com/p/getelementsbyclassname

Works great in all browsers. Even works in MSIE.

Krupski
07-18-2011, 04:57 PM
yeah, it just hide them,but i want to remove all of them..

Here's a neat little function that removes tags but leaves the text content in place:



/***
* remove tag specified by element e
* text content remains
***/
var removeTags = function (e) {
e.parentNode.insertBefore(document.createTextNode(e.innerHTML), e);
return e.parentNode.removeChild(e);
}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum