CODEWITHSUNDEEP
javascripttexthideelement
user1843471
user1843471

Reputation: 35

hide part of the content of an element

Sorry, this may be kind of weird problem:

I have an existing HTML code, which I can not directly edit or delete parts of it. The problem is: Inside a div-element in this code, there is some text which I want to hide. There are also another element inside of this div, which I don't want to hide. It looks something like this:

<div>
....Text I want to hide....
<table> ... Text I don't want to hide...</table>
</div>

My question: Is it possible to hide the "....Text I want to hide...." while not hiding the "... Text I don't want to hide..."? (for example using javascript?)

Upvotes: 1

Views: 443

Answers (3)

user1726343
user1726343

Reputation: 

var txt = div.childNodes[0];
var range = document.createRange();
range.selectNode(txt);
var span = document.createElement("span")
range.surroundContents(span);
span.style.display = "none";

See it here: http://jsfiddle.net/KZVDf/

Upvotes: 3

Epsil0neR
Epsil0neR

Reputation: 1704

Surround text which you want to hide with span and set to that span display:none. Example:

<div>
<span style="display:none">....Text I want to hide....</span>
<table> ... Text I don't want to hide...</table>
</div>

Or make it with hidden with script:

$('div span').show(); // Show hidden text in span
$('div span').hide(); // Hide text in span

Upvotes: 0

ruakh
ruakh

Reputation: 183321

If you want to remove the text, you can write:

div.removeChild(div.firstChild);

(where div is a variable referring to this <div> element).

If you want to wrap it in a <span> that you can then hide and unhide at will, you can write:

var span = document.createElement('span');
div.insertBefore(span, div.firstChild);
span.appendChild(div.firstChild);

(where div is as before).

Upvotes: 0

Related Questions