Find first word in html and replace - html

I have following construct:
<h1>
<span>
</span>
</h1>
....
and
<div id="tourname">Riding trip arround the volcano</div>
Now the div with the id is filled by a php function and I would like that
my h1 looks like this:
<h1>
<span>Riding</span>
trip arround the volcano
</h1>
I managed to fill the h1 using this function:
$("h1").html($("#tourname").html());
but I have no idea how to split my string into 2 parts and fill one part
into that span and the rest behind the /span
Can you give a hint ?
Many thanks

You can do that in 2 ways .
1 - When you are writing using php , you can create the span for first word.
2 - Using jQuery. You can see the below code using jQuery
$(document).ready(function(){
var text = $("#tourname").html();
var firstword = text.substr(0,text.indexOf(' ')); // to get the first word
var remaining = text.substr(text.indexOf(' ')+1); // remianing words
var final = '<span>'+firstword+'</span> '+ remaining // combining by adding <span> around the first word
$("h1").html(final);
});

use this:
var strArr = $("#tourname").html().split(' ');
$("h1 span").html(strArr.shift());
$("h1").append(document.createTextNode(strArr.join(" ")));
This should be of some help.
Also consider this fiddle
This will be specific to your use only.
For more flexibility with number of text elements use strArr.splice(index, number_of_elements_to_include_in_span);
instead of strArr.shift();

Related

How to extract the hyperlink text from a <a> html tag?

Given a string containing 'blabla text blabla', I want to extract 'text' from it.
regexp doc suggests '<(\w+).*>.*</\1>' expression, but it extracts the whole <a> ... </a> thing.
Of course I can continue using strfind like this:
line = 'blabla text blabla';
atag = regexp(line,'<(\w+).*>.*</\1>','match', 'once');
from = strfind(atag, '>');
to = strfind(atag, '<');
text = atag((from(1)+1):(to(2)-1))
, but, can I use another expression to find text at once?
You can use the extractHTMLText function in Matlab, you can read about it in the following link.
Example that get the desired output:
line = 'blabla text blabla';
l = split(extractHTMLText(line), ' ');
l{2}
If you don't want to use a built in function you could use regex as Nick suggested.
line = 'blabla text blabla';
[atag,tok] = regexp(line,'<(\w+).*>(.*?)</\1>','match','tokens');
t = tok(1,1){1};
t{2}
and you'll get the desired output
You can simply use a Group.
Update of your pattern will be something like this:
<(\w+).*>(.*)<\/\1>
and this one include all tags:
<.*>(.*)<.*>
Regex101
If you are using JQuery try this. No Regex required. But this might negatively impact performance if the DOM is hefty.
$jqueryobj = $(line);
var text = $jqueryobj.find("a").text();

Css 'const' chars in text input

Is there any way to set 'const' chars to text in css or html?
For Example user writes phone number 646830293 and in text (one input) this is 646-830-293 (so every fourth and eighth chars are '-').
jQuery Mask Plugin might the solution for you. It's very simple to use and has very good customization.
From the documentation, you'd write a simple mask with:
$(document).ready(function(){
$('.date').mask('00/00/0000');
$('.time').mask('00:00:00');
$('.date_time').mask('00/00/0000 00:00:00');
});
The whole page has a lot more examples!
Using your pastebin, here's the result:
I think you cannot do it with pure CSS but it is very simple only using Javascript.
var text = document.getElementById('text').innerHTML;
var output = text.substring(0, 3) + "-" + text.substring(3, 6) + "-" + text.substring(6);
document.getElementById('output').innerHTML = output;
<p id="text">646830293</p>
<p id="output"></p>

Parse html code and set <span> tag

<div id=bar>
Hey, <b>how</b> are <span><u><b>you</b>?</u></span>
</div>
I need to parse this code and set a span tag in a determined position identified by a start and an end.
An example is: START: 15 - END: 16
(note, "start" and "end" are set from the simple string "Hey, how are you?")
<div id=bar>
Hey, <b>how</b> are <span><u><b>y<span id=someid>ou</span></b>?</u></span>
</div>
My idea is to parse the node "bar", getting its html code, and with a complex OOP algoritm set the span tag, but...it's hard and long to do. (everything in JS)
Is there a good programming language to semplify my work?
I think I get what you are trying to do. Try this out:
var text = $("#bar").text(); //jQuery gives you the text...strips the html tags
var html = $("#bar").html(); //jQuery gives you the html and text here
text = $.trim(text); //remove any whitespace from start and end
var original = text.substr(14, 2); //Get the substring you want
var updated = "<span id='someid'>" + original + "</span>";
html = html.replace(original, updated); //replace
$("#bar").html(html); //set new html
JsFiddle here: http://jsfiddle.net/bbcLm97o/2/

split data(Text) of a text field into two strings, and use each string on different section of a visualforce page

I have an account with a Note in notesandattachment related list.
I want to display the text of 8 lines, out of 50 lines on a section of visualforce page.
And remaining 42 lines in another section of same visualforce page.
what i know :
I need to split the notes.body into two substrings. One, with 8 lines of text and second one with 42 line.I need to use div tags to get this done on the visualforce page. I might be wrong.
Please suggest me, how do i achieve this.
Appreciate the help.
You can split the text in controller by using split() method like this
String allLines[] = allText.split('\n');
String first8Lines = '';
String restLines ='';
for(Integer i =0; i<8 ; i++){
first8Lines += allLines[i];
}
for(Integer i =7; i<50 ; i++){
restLines += allLines[i];
}
And then put {!first8Lines} in one place and {!restLines} in another

How to split line of text (first half bold, second half not bold) when creating document using Google Script

Instead of:
doc.appendparagraph();
how do you add a line of text to your document without it returning to the next line?
I'm trying to break up a line of text and bold the first half the sentence with .setAttributes(bold);
bold which I've defined using....
var boldpl = {};
boldpl[DocumentApp.Attribute.BOLD] = true;.
Thank you.
I've figured out how to do this in a roundabout way using a merge feature, but how do you go about adding a new line instead of a new paragraph? There is no doc.appendText(); feature is there?
Also is there an easy way to make my document single spaced?
You've asked a lot of different questions there!
Given an existing paragraph, how can some portion of it be rendered in
bold while the rest remains normal?
A Document contains a Body, which can contain Paragraphs, each of which can contain other elements, including Text. You can get that Text either as a string - which you can't do much with - or as a Text Object. Here's an example of using the Text.setBold() method to change just some text in a paragraph to bold:
var doc = DocumentApp.getActiveDocument();
var body = doc.getBody();
var firstParagraph = body.getParagraphs()[0];
textElement = firstParagraph.editAsText();
textElement.setBold(0,6,true); // Set the 0th to 6th characters bold
Alternatively, you could use the Text.setAttributes() method with your custom attribute boldpl:
textElement.setAttributes(0,6, boldpl)
Starting with that building block, you could do things like:
Apply bold from the start of a paragraph until the first occurrence of a colon (:).
Apply bold to the first few words.
...or even apply bold to the first half!
textElement.setBold(0,
Math.floor((textElement.getText().length)/2),
true);
There is no doc.appendText(); feature is there?
No... but there is a Paragraph.appendText() method.
Also is there an easy way to make my document single spaced?
You can control the line spacing of text within paragraphs, by setting attributes on individual paragraphs. See Paragraph.setLineSpacing(). Here's a function that sets every paragraph in your document to single-spacing:
function singleSpace() {
var doc = DocumentApp.getActiveDocument();
var bodyElement = DocumentApp.getActiveDocument().getBody();
var paragraphs = bodyElement.getParagraphs();
// Set each paragraph to single-spaced
paragraphs.forEach( function( paragraph ) {
paragraph.setLineSpacing( 1.0 );
});
}