This question already has answers here:
How to get the pure text without HTML element using JavaScript?
(10 answers)
Closed 5 years ago.
Is there a method or function that does this, or do I have to check each character of a string. To give an idea on what I'm talking about, for example. I have an HTML TEXT like:
<p><strong>Welcome </strong>to this <em>message, </em><span style="text-decoration: underline;">you may come in peace.</span></p>
I need to convert it into a plain text, resulting into:
Welcome to this message, you may come in peace.
The text will come from a textarea which is a child of a div with an id = editor-email.
I also wanted to take the current text, but it won't work.
var textEmail = $('#editor-email').find('textarea').text();
You can do it like with pure JS
let a = `<p><strong>Welcome </strong>to this <em>message, </em><span style="text-decoration: underline;">you may come in peace.</span></p>
`;
let d = document.createElement('div');
d.innerHTML = a;
console.log(d.innerText);
If you're looking for a JQuery-free solution, you can select the element and use .innerText:
document.querySelector('#myElement').innerText
I think you need:
$("p").text()
EDIT:
If you want the value from the textarea then you will need:
$("#editor-email > textarea").val();
Related
This question already has answers here:
How can I use the event #select to select some text from a paragraph in Vue.js?
(2 answers)
Closed 2 years ago.
Is it possible to select text or get the position of highlighted text inside a paragraph <p> ?
I am showing a text sentence by sentence using a loop of paragraph in vuejs.
<p
class="mreadonly text-left mark-context"
v-for="line in jsonData.first.segments"
v-bind:key="line.idx"
#mouseup="mouseupSel($event)"
>{{line.text}}</p>
The mouseup is what I think is the only possible event I can use, since onselect (#select on vue) doesn't work with paragraph.
What could I do to get an onselect-like event, taking into account that I need the selected text mainly to split the original complete string in two parts?
Should I convert my paragraph into input tags? Is it possible to make them look like paragraphs?
Thanks to Leeish, here is what I've done. It's a slightly duplicate question apparently, but the answer here might help anyway.
The HTML stay the same, with #mouseup.
On methods I wrote (as quick and dirty example):
mouseup(ev){
console.log('onselect',ev);
var gs = window.getSelection();
var data = gs.baseNode.data;
var data2 = data.substr(gs.anchorOffset+gs.toString().length,data.length);
var data1 = data.substr(0,gs.anchorOffset) + gs.toString();
console.log(data1);
console.log(data2);
},
This question already has answers here:
How to put HTML in jQuery .text()
(6 answers)
Closed 5 years ago.
I am trying to grab text inside a page, and put it inside a div/span element using jQuery.
For example, grab <p>Did you know "LARC" is a Medical Term?</p> off a webpage and put it inside of a div like so: <p>Did you know <div class="LARC IS COOL">"LARC"</div> is a Medical Term?</p>
The reason I am asking is because I need to run a function on a specific word with a class but I don't have access to the html where that word is due to the fact it comes from an outside source and is loaded on the page.
This is what I currently have:
jQuery('.gfield_label').each(function() {
var text = jQuery(this).text();
jQuery(this).text(text.replace("LARC", "<div class='LARC IS COOL'>LARC</div>"));
});
But it just outputs this on the webpage:
Did you know <div title='THIS BETTER WORK'>LARC</div> is a medical term?
You will want to use the HTML function when replacing.
see: http://api.jquery.com/text/ and
http://api.jquery.com/html/
jQuery('.gfield_label').each(function() {
var text = jQuery(this).text();
jQuery(this).html(text.replace("LARC", "<div class='LARC IS COOL'>LARC</div>"));
});
Instead of using .text(), try using .html().
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
jQuery get textarea text
So i have a text area that takes the users input. How do i get text inside the text area and put it in my <div id="prev"> inside <p> tag?
i tried using this:
function displayCustom() {
var customText = $('textarea#custom').val();
$('prev p').text(customText); //<-- this doesnt work
//alert(text); <-- if i try using this it works
}
You should use # for the ID selector:
$('#prev p').text(customText);
You can append your text inside <p> like this:
var customText = $('#custom').val();
$('#prev').append('<p>'+customText+'</p>');
This question already has answers here:
How can I change an element's text without changing its child elements?
(16 answers)
Closed 1 year ago.
I have next html:
<label for="user_name">
<abbr title="required">*</abbr>
Name
</label>
And I want to change label caption to Title with jquery. So I do
$('label[for=user_name]').html('Title')
And it replaces all inner html (including abbr tag)
So, what's the easiest way to replace only Name?
If you use contents() method it will also return text nodes. Since jQuery doesn't have text node methods, convert last node to a DOM node
$('label[for="user_name"]').contents().last()[0].textContent='Title';
Demo: http://jsfiddle.net/yPAST/1/
Sorry for the late reply... But here is a way to do so using only jQuery:
$('label').contents().last().replaceWith('Title');
It may not be the prettiest way, but this works:
var $label = $('label[for=user_name]');
$label.html($label.html().replace("Name", "Title"));
You can select only the abbr element, store it, and then replace the whole content with the stored element plus the changed caption:
$('label[for="user_name"]').each(function(){
var a = $(this).children('abbr');
$(this).html(a).append('Title');
});
See this fiddle
you can use replace accomplish this
var html = $('label[for=user_name]').html().replace('Name','Testing');
$('label[for=user_name]').html(html);
check it : http://jsfiddle.net/DyzMJ/
Evans solution added to jquery fn to make it's use comfortable:
// get/change node content not children
jQuery.fn.content = function( n ){
var o = $(this).clone();
var c = o.children().remove();
if (typeof n === "string" ){
o.html(n);
$(this).html(c).append(n);
}
return o.html();
}
Usage :$('myselector').content('NewContentString');
This is the solution that worked for the most browsers
$('label[for="user_name"]').contents().last()[0].nodeValue = 'Title';
This one came close but gave issues in ie8 since textContent is not supported
$('label[for="user_name"]').contents().last()[0].textContent='Title';
if you are manipulating more than 1 label you can select each label and replace text with jquery:
$('label[for="user_name"]').contents().last().replaceWith("Title");
and for the second label :
$('label[for="user_lastname"]').contents().last().replaceWith("Title2");
and so on ...
This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
Strip HTML from Text JavaScript
Here's a string
var s = "This is <strong>something</strong>."
And I want to remove any HTML tags from this string.
It doesn't matter if your answer is not about regex. Thanks.
Try this
s.replace(/<[^>]*?>/g, '');
JsFiddle DEMO
following jQuery sample will help you
function getString(html)
{
return $("<DIV>").html(html).text();
}
Strip HTML from Text JavaScript
try this one.to be useful this you have to put your string in html and body tags.
You could use the innerText property of DOM elements (or textContent for Firefox):
var s = 'This is <strong>something</strong>.',
div = document.createElement('div');
div.innerHTML = s;
s = div.innerText || div.textContent;