How can i get the displayed Text as it is shown in JS

Question

I want to read out a text width JS on a website as it is shown not how it is delivered by PHP or anything else. e.g. delivered text:

ABCDE

rendered text (that I want to have):

AB
CD
E

Does anybody know a way ?

thanks for your help!

can you post the php line that print ABCDE – Ghassan Elias Aug 31 '12 at 08:38 — Ghassan Elias, Aug 31 '12 at 08:38

score 0 · Answer 1 · answered Aug 31 '12 at 08:34

0

Not sure if I have read what you're asking correctly but are you talking about displaying code as text on a page? If so you should be able to use the <pre> </pre> HTML elements to do this.

answered Aug 31 '12 at 08:34

Barlow1984

205
1
3
14

pre is deprecated - perhaps a span with mono spaced font? – mplungjan Aug 31 '12 at 08:49
Aha so it is! Didn't realise, you can use tags though, see here: http://www.w3schools.com/html5/tag_phrase_elements.asp – Barlow1984 Aug 31 '12 at 08:52

KooiInc · Answer 2 · 2012-08-31T10:04:30.000

0

A generic function to split up a string into chunks of [n] characters, using a [splitter]:

function splitByX(str,n,splitter){
     n = n || 2;
     splitter = splitter || ' ';
     var x = [];
     for (var i=0;i<str.length;i+=n){
        x.push(str.slice(i,i+n));
     }
     return x.join(splitter); 
}
var strFormatted  = splitByX('ABCDEFGHIJ')    //=> "AB CD EF GH IJ"
   ,strFormatted2 = splitByX('ABCDEFGHIJ',3); //=> "ABC DEF GHI J"
   ,strFormatted3 = splitByX('ABCDEFGHIJ',3,'<br>'); 
       //=> "ABC<br>DEF<br>GHI<br>J"

For a <span> with the text within:

var receivedSpan = /*[retrieve the span using a DOM method]*/;
receivedspan.innerHTML = splitByX(receivedspan.innerHTML,2,'<br>');

Alternatively you can style the span in PHP:

<span style="white-space:pre">AB\nCD\nE</span>

edited Aug 31 '12 at 10:04

answered Aug 31 '12 at 08:46

KooiInc

119,216
31
141
177

sorry the spacings are line breaks. the original text is without any line breaks, but the browser renders it with line breaks. i want to grab the text generic from the browsers view. The text is embedded in a span – user1410569 Aug 31 '12 at 09:26
Then your question is not really clear. You receive `AB\nCD\nE` from the server (PHP) and want to render it with line breaks? – KooiInc Aug 31 '12 at 09:30
I edited the answer, the last function now uses a `splitter` argument. Edited your question too, to clarify it. – KooiInc Aug 31 '12 at 09:34
@Kooilnc No. I receive from the Server `My text without line breaks`. The Browser renders it to `My text\nwithout\nline breaks`. I want to read out from the browsers view (with the line breaks). The \n are symbolic for what the CSS does with word-wrapping. – user1410569 Aug 31 '12 at 09:36
Ok i want to get more congrete: the span itself where the text is in, has overflow:hidden text-overflow:clip style. I want to cut off the last displayed 4 characters and append " ..." instead. Do you know for that a way. Thank you for help. – user1410569 Aug 31 '12 at 10:10
That's a totally different question. See http://stackoverflow.com/questions/1199352/smart-way-to-shorten-long-strings-with-javascript/1199420#1199420 – KooiInc Aug 31 '12 at 10:18
Does this script also handle multiple lines ? so that you can get for example 2 line where the second line has the three dots ? – user1410569 Aug 31 '12 at 10:28
It handles a string. If you want it to handle lines, i.e. multiple strings, you should code something around it. Please try thinking for yourself. If you want to continue this new question, add it as a new question to SO, or better still, try searching SO for answers, they [the answers] are very likely already given. – KooiInc Aug 31 '12 at 10:33

How can i get the displayed Text as it is shown in JS

2 Answers2