Question

180

Using innerHTML.replace to replace text to create link

rated 0 times [ 186] [ 6] / answers: 1 / hits: 32279 / 15 Years ago, tue, may 19, 2009, 12:00:00

I'm using Sharepoint (WSS 3.0), which is unfortunately very limited in its ability to format survey questions (i.e., it strips any HTML you enter). I saw a solution elsewhere that suggested we add some JS to our master page file in order to allow line breaks. This works beautifully, but I'd like to see if we can allow links as well.

In our WSS surveys, I can now use {{br}} anywhere I want a line break (this works). I have tried extending the code to allow the use of link tags (e.g., {{link1}}url{{link2}}URL Title{{link3}}; but, this doesn't work, presumably because the updates aren't happening as a whole, and the browser then tries to render it piece by piece, confusing it. (FF and IE show different results, but both fail. If I mix up the order of the JS below -- i.e., do link3, 2 and then 1 -- the output changes as well, but still fails.) Is there a better way to do this?

<script language=JavaScript>

var className;

className = 'ms-formlabel';

var elements = new Array();

var elements = document.getElementsByTagName('td');

for (var e = 0; e < elements.length; e++)

{

if (elements[e].className == className){

elements[e].innerHTML = elements[e].innerHTML.replace(/{{br}}/g,'<br/>');

elements[e].innerHTML = elements[e].innerHTML.replace(/{{link1}}/g,'<a href=');

elements[e].innerHTML = elements[e].innerHTML.replace(/{{link2}}/g,'>');

elements[e].innerHTML = elements[e].innerHTML.replace(/{{link3}}/g,'</a>');}

}

</script>

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

devlin

Add To Favorites

Follow

Total Points: 474

Total Questions: 113

Total Answers: 100

Location: Sweden

Member since Fri, Apr 16, 2021

3 Years ago

devlin questions

1 How to watch public directory in Vite project for hot-reload?

Tue, Oct 19, 21, 00:00, 3 Years ago

1 how detect an element move (changing position) in document?

Tue, Apr 27, 21, 00:00, 3 Years ago

1 Difference between router.pathname and router.route in nextjs

Sat, Dec 19, 20, 00:00, 3 Years ago

1 Postman: custom signing request with SHA256 and RSA

Sat, Oct 31, 20, 00:00, 4 Years ago

1 disable fullscreen mode on html video on mobile devices

Fri, Aug 28, 20, 00:00, 4 Years ago

View All

answered 15 Years ago robertjaysona · Accepted Answer

Instead of modifying the innerHTML property in chunks (the browser tries to update the DOM each time you change innerHTML, which if you provide incomplete/broken markup, will obviously mess things up), do all your modifications against your own string variable, and then overwrite the entire innerHTML with your completed string:

<script language=JavaScript>

var className;

className = 'ms-formlabel';

var elements = new Array();

var elements = document.getElementsByTagName('td');

for (var e = 0; e < elements.length; e++)

{

if (elements[e].className == className) {

    var newHTML = elements[e].innerHTML;



    newHTML = newHTML.replace(/{{br}}/g,'<br/>');

    newHTML = newHTML.replace(/{{link1}}/g,'<a href=');

    newHTML = newHTML.replace(/{{link2}}/g,'>');

    newHTML = newHTML.replace(/{{link3}}/g,'</a>');}



    elements[e].innerHTML = newHTML;

}

</script>