473,385 Members | 1,834 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,385 software developers and data experts.

Replace all <br> in a div in current document

I have done this simple function, it seems to work as intended, to
solve a problem i have had for a while. I couldnt find any sample
around that was working for me.
I would like to test it with you and see if there are any improvments
that i should make ;-)
It should be fast and if possible compatible with todays modern
browser-standards. It should be activated by the onload-event.

This is my code, free for all to use:

<html><head>
<title>brTest</title>
</head>
<body>
<br>
<div id=mybrid>
<a id=myid1 href="#">Text 1 with<br>a linebreak (&lt;br&gt;)</a>
<br clear="all">
<a id=myid2 href="#">Text 2 with<br>a linebreak (&lt;br&gt;)</a>
</div>
<br>
<a id=myid3 href="#">Text 3 with<br>a linebreak (&lt;br&gt;) that
should remain as it is.</a>
<br><br>
<SCRIPT LANGUAGE="JavaScript"><!--
function brTest(){
var d=document.getElementById;
d("mybrid").innerHTML=d("mybrid").innerHTML.replac e(/<br>/gim,"&nbsp;");
}
//--></SCRIPT>
<form>
<button onclick="brTest();">Call brTest()</button>
</form>
</body>
</html>
Jul 20 '05 #1
6 12127
la************@varbostad.se (Lasse) writes:
I have done this simple function, it seems to work as intended, to
solve a problem i have had for a while. I couldnt find any sample
around that was working for me.
I would like to test it with you and see if there are any improvments
that i should make ;-)
I have had cases where
element.innerHTML = element.innerHTML
changed how the page worked, mostly wrt. event handlers. Also,
innerHTML is not compatible with modern standards (event if modern
browsers understand it)

I would prefer:

<script type="text/javascript">
function brTest(){
var brs = document.getElementById("mybrid").getElementsByTag Name("br");
for(var i=brs.length-1;i>=0;i--) {
var elem = brs[i];
elem.parentNode.removeChild(elem);
}
}
</script>

(no language attribute on the script tag and no HTML comments in the
script area!)
It should be fast and if possible compatible with todays modern
browser-standards.


It is pure DOM 2 Core, so that should be compatible with modern
browser standards. Tested in IE6, Mozilla Firebird 0.6, Opera
7.2beta3.

/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
'Faith without judgement merely degrades the spirit divine.'
Jul 20 '05 #2
la************@varbostad.se (Lasse) writes:
I have done this simple function, it seems to work as intended, to
solve a problem i have had for a while. I couldnt find any sample
around that was working for me.
I would like to test it with you and see if there are any improvments
that i should make ;-)
I have had cases where
element.innerHTML = element.innerHTML
changed how the page worked, mostly wrt. event handlers. Also,
innerHTML is not compatible with modern standards (event if modern
browsers understand it)

I would prefer:

<script type="text/javascript">
function brTest(){
var brs = document.getElementById("mybrid").getElementsByTag Name("br");
for(var i=brs.length-1;i>=0;i--) {
var elem = brs[i];
elem.parentNode.removeChild(elem);
}
}
</script>

(no language attribute on the script tag and no HTML comments in the
script area!)
It should be fast and if possible compatible with todays modern
browser-standards.


It is pure DOM 2 Core, so that should be compatible with modern
browser standards. Tested in IE6, Mozilla Firebird 0.6, Opera
7.2beta3.

/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
'Faith without judgement merely degrades the spirit divine.'
Jul 20 '05 #3


Lasse wrote:
I have done this simple function, it seems to work as intended, to
solve a problem i have had for a while. I couldnt find any sample
around that was working for me.
I would like to test it with you and see if there are any improvments
that i should make ;-)
It should be fast and if possible compatible with todays modern
browser-standards. It should be activated by the onload-event.

This is my code, free for all to use:

<html><head>
<title>brTest</title>
</head>
<body>
<br>
<div id=mybrid>
<a id=myid1 href="#">Text 1 with<br>a linebreak (&lt;br&gt;)</a>
<br clear="all">
<a id=myid2 href="#">Text 2 with<br>a linebreak (&lt;br&gt;)</a>
</div>
<br>
<a id=myid3 href="#">Text 3 with<br>a linebreak (&lt;br&gt;) that
should remain as it is.</a>
<br><br>
<SCRIPT LANGUAGE="JavaScript"><!--
function brTest(){
var d=document.getElementById;
d("mybrid").innerHTML=d("mybrid").innerHTML.replac e(/<br>/gim,"&nbsp;");
}
//--></SCRIPT>
<form>
<button onclick="brTest();">Call brTest()</button>
</form>
</body>
</html>


Setting innerHTML means the browser needs to reparse the complete HTML
content of the HTML and render it. If all you want is to replace some
<br> elements then you can use the DOM (unless you want to cover IE4 but
your solution doesn't do it with the use of document.getElementById):

<html>
<head>
<title>replacing <br> elements</title>
<script type="text/javascript">
function replaceBRs (elementId, replacementText) {
var element, brs;
if (document.getElementById) {
element = document.getElementById(elementId);
if (element && element.getElementsByTagName &&
document.createTextNode) {
brs = element.getElementsByTagName('br');
while (brs.length) {
var br = brs[brs.length - 1];
var replacement = document.createTextNode(replacementText);
br.parentNode.replaceChild(replacement, br);
}
}
}
}
</script>
</head>
<body>
<p>
<input type="button" value="replace brs"
onclick="replaceBRs('testDiv', String.fromCharCode(160));">
</p>
<div id="testDiv">
<a href="http://JavaScript.faqts.com/">
JavaScript FAQTs
<br>
JavaScript Questions and Answers
</a>
<br>
<p>
All for Kibology.
<br>
Kibology for all.
</p>
</div>
</body>
</html>

--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 20 '05 #4


Lasse wrote:
I have done this simple function, it seems to work as intended, to
solve a problem i have had for a while. I couldnt find any sample
around that was working for me.
I would like to test it with you and see if there are any improvments
that i should make ;-)
It should be fast and if possible compatible with todays modern
browser-standards. It should be activated by the onload-event.

This is my code, free for all to use:

<html><head>
<title>brTest</title>
</head>
<body>
<br>
<div id=mybrid>
<a id=myid1 href="#">Text 1 with<br>a linebreak (&lt;br&gt;)</a>
<br clear="all">
<a id=myid2 href="#">Text 2 with<br>a linebreak (&lt;br&gt;)</a>
</div>
<br>
<a id=myid3 href="#">Text 3 with<br>a linebreak (&lt;br&gt;) that
should remain as it is.</a>
<br><br>
<SCRIPT LANGUAGE="JavaScript"><!--
function brTest(){
var d=document.getElementById;
d("mybrid").innerHTML=d("mybrid").innerHTML.replac e(/<br>/gim,"&nbsp;");
}
//--></SCRIPT>
<form>
<button onclick="brTest();">Call brTest()</button>
</form>
</body>
</html>


Setting innerHTML means the browser needs to reparse the complete HTML
content of the HTML and render it. If all you want is to replace some
<br> elements then you can use the DOM (unless you want to cover IE4 but
your solution doesn't do it with the use of document.getElementById):

<html>
<head>
<title>replacing <br> elements</title>
<script type="text/javascript">
function replaceBRs (elementId, replacementText) {
var element, brs;
if (document.getElementById) {
element = document.getElementById(elementId);
if (element && element.getElementsByTagName &&
document.createTextNode) {
brs = element.getElementsByTagName('br');
while (brs.length) {
var br = brs[brs.length - 1];
var replacement = document.createTextNode(replacementText);
br.parentNode.replaceChild(replacement, br);
}
}
}
}
</script>
</head>
<body>
<p>
<input type="button" value="replace brs"
onclick="replaceBRs('testDiv', String.fromCharCode(160));">
</p>
<div id="testDiv">
<a href="http://JavaScript.faqts.com/">
JavaScript FAQTs
<br>
JavaScript Questions and Answers
</a>
<br>
<p>
All for Kibology.
<br>
Kibology for all.
</p>
</div>
</body>
</html>

--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 20 '05 #5
Thanks a lot for your suggestions. It is a much cleaner way to do this.
One reason why i did not use getElementsByTagName("br") as identifier
was that i would like to keep <br clear="all">
Well, i could use <p> instead.
I will try it out.
/Lasse

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!
Jul 20 '05 #6
Thanks a lot for your suggestions. It is a much cleaner way to do this.
One reason why i did not use getElementsByTagName("br") as identifier
was that i would like to keep <br clear="all">
Well, i could use <p> instead.
I will try it out.
/Lasse

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!
Jul 20 '05 #7

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

4
by: fis | last post by:
Hi all, I've problem because there are needed break lines in my texts on the web site but i can't do it :( My pipeline looks like: XMS -> I18N -> XSLT -> HTML I have lot of texts in my...
7
by: noor.rahman | last post by:
I have an XML file that stores data from an HTML form. I use XSL to display the data in HTML format. The data may have newline characters. However, XSL is not displaying the newlines properly in...
15
by: tshad | last post by:
How do I go about this? I used to know this, but can't find VB.net replace that does this. Something like string.replace("<br>",NL) Thanks,
4
by: Christofer Dutz | last post by:
Hi, I am having a small problem, that is driving me nuts. My application reads some Xml and runs 2 Xsl Transformations to generate HTML. As soon as my second XSL introduces some <br/tags, the...
2
by: xhe | last post by:
I met a very headache problem in javascript, I think this might be difference between IE and NS / Safari. I have a text area <form> <textarea name='tex1' onkeyup='displayit();'></textarea>...
7
by: Nathan Sokalski | last post by:
Something that I recently noticed in IE6 (I don't know whether it is true for other browsers or versions of IE) is that it renders <br/and <br></br> differently. With the <br/version, which is what...
1
by: divina11 | last post by:
function sort() { c.sort() document.getElementById('display').innerHTML=""; document.getElementById('display').innerHTML=c +'<br>'; } // document.getElementById('display').innerHTML=c...
8
luke14free
by: luke14free | last post by:
Hello, I'm creating a form to let user leave comments, I'm having a problem, because I need to convert all the \n to <br/>. After several tries I came out with this simple function <script...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.