I have a string which contains 2 div in it with their text and settings.
for example :
<div class="a" id="b">blabla </div><div class="a">Here is the text i need to get </div>
I need to pull out the text from this string, cant use sub string cause the text is dynamic and not always written the same.
Thanks
var str = '<div class="a" id="b">blabla </div><div class="a">Here is the text i need to get </div>';
var tmp = document.createElement('div');
tmp.innerHTML = str;
console.log(tmp.innerText || tmp.textContent); // is this what you want?
Try a regex replace like
'<div class="a" id="b">blabla </div><div class="a">Here is the text i need to get </div>'.replace(/(\<div.*?\>|\<\/div\>)/g, '')
Demo: Fiddle
Related
Having some problems with regex.
I have long string
str = '<div class=\"edit\">some text here
<div><br></div>
<div>then other row</div>
<div><br></div>
<div>and one more</div>
</div>
<div class=\"edit\">some text here
<div><br></div><div>then other row</div></div>'
and I want to have:
<div class\"edit\">some text here<br>then other row<br>and one more<div>
<div class=\"edit"\>some text here<br>then other row<div>
And i trying do this:
str = str.replace(/<div><br><\/div>/ig, "<br>");
str = str.replace(/<div>/ig, "<br>");
str = str.replace(/<\/div>/ig, "");
Generally speaking it is bad idea to transform html-strings using regexp. There is DOM for that. Nevertheless this one seems to work:
str = str.replace(/<div><br><\/div>/gi, '<br>')
.replace(/<div>([^<]*)<\/div>/gi, '$1');
The resulting string is "<div class="edit">some text here <br> then other row <br> and one more</div><div class="edit">some text here<br>then other row</div>"
I am having a string "<F1>" and whenever I add it as html to a particular div using jquery's html(), as
var str = "<F1>";
$("div").html(str);
It generates html for div as
"<f1></f1>"
But I dont want such tag creation.
I need to have div with html as
"<F1>"
It will be appreciated if somebody guide me, to achieve this. :(
Use .text() instead of .html().
var str = "<F1>";
$("div").text(str);
Fiddle: http://jsfiddle.net/6942a/
To escape the HTML entities in str and use .html() you can do the following:
var str = "<F1>";
str = $("<div/>").text(str).html();
$("div").html(str);
Updated jsfiddle: http://jsfiddle.net/6942a/3/
Use this :
HTML:
<div></div>
<input type="text">
<input type="button" value="ADD">
jQuery :
$(function(){
$('input[type=button]').click(function(){
var text = $('input[type=text]').val();
text =text.replace('<','<');
text =text.replace('>','>');
$("div").html(text);
});
});
Demo
For more information see html entities
Try this
var str = '<f1>';
var res = str.replace("<", "<");
res=res.replace(">", ">");
$("div").text(res);
Fiddle
I have a string of html in javascript/jquery.
var str = '<div id="cheese" class="appleSauce"> I like apple and cheese</div>';
I want to make the string 'apple' bold. So I do:
str = str.replace('apple','<b>apple</b>');
but this breaks the html part of the string. I get:
<div id="cheese" class="<b>apple</b>Sauce"> I like <b>apple</b> and cheese</div>
How can I replace all occurrences of a string in the text of an html string without changing the matches inside of html markup?
var e = $('#cheese');
e.html(e.text().replace('apple','<b>apple</b>'));
Working Fiddle
Create an element, jQuery element in this case, and set the innerHTML property:
var el = $('<div id="cheese" class="appleSauce"> I like apple and cheese</div>');
el.html(el.html().replace('apple','<b>apple</b>'));
You can do it like that
var str=str.replace(new RegExp(/(apple)$/),"<b>apple</b>");
I want to get the text of the next id (the text is: "Show More").
<div id="show_more_less" onclick="Show_More_Less();">Show more</p>
function Show_More_Less() {
var str = document.getElementById('show_more_less').text;
}
I tried: .value but it doesn't work.
To get the text of an element in a cross browser way, you can do this :
var e = document.getElementById('show_more_less');
var text = e.textContent || e.innerText;
Try innerHTML:
var str = document.getElementById('show_more_less').innerHTML;
Also you have an opening <div> tag and a closing </p> tag which is inconsistent. You probably meant:
<div id="show_more_less" onclick="Show_More_Less();">Show more</div>
Should make some checks to see if childNodes[0] exists and if it's a text node, but basically:
var str = document.getElementById('show_more_less').childNodes[0].nodeValue;
I have somewhere on website a specific text, let's say "lollypops", and I want to replace all the occurrences of this string with "marshmellows". The problem is that I don't know where exactly the text is. I know I could do something like:
$(body).html($(body).html().replace('lollypops', 'marshmellows'));
This would probably work, but I need to rewrite as little HTML as I can, so I'm thinking something like:
search for the string
find the closest parent element
rewrite only the closest parent element
replace this even in attributes, but not all, for example replace it in class, but not in src
In example, I would have structure like this
<body>
<div>
<div>
<p>
<h1>
<a>lollypops</a>
</h1>
</p>
<span>lollypops</span>
</div>
</div>
<p>
<span class="lollypops">Hello, World!</span>
<img src="/lollypops.jpg" alt="Cool image" />
</p>
<body>
In this example, every occurrence of "lollypops" would be replaced, only <img src="... would remain the same and the only elements that would actually be manipulated would be <a> and both <span>s.
Does anybody know how to do this?
You could do something like this:
$("span, p").each(function() {
var text = $(this).text();
text = text.replace("lollypops", "marshmellows");
$(this).text(text);
});
It will be better to mark all tags with text that needs to be examined with a suitable class name.
Also, this may have performance issues. jQuery or javascript in general aren't really suitable for this kind of operations. You are better off doing it server side.
You could do something this way:
$(document.body).find('*').each(function() {
if($(this).hasClass('lollypops')){ //class replacing..many ways to do this :)
$(this).removeClass('lollypops');
$(this).addClass('marshmellows');
}
var tmp = $(this).children().remove(); //removing and saving children to a tmp obj
var text = $(this).text(); //getting just current node text
text = text.replace(/lollypops/g, "marshmellows"); //replacing every lollypops occurence with marshmellows
$(this).text(text); //setting text
$(this).append(tmp); //re-append 'foundlings'
});
example: http://jsfiddle.net/steweb/MhQZD/
You could do something like this:
HTML
<div class="element">
<span>Hi, I am Murtaza</span>
</div>
jQuery
$(".element span").text(function(index, text) {
return text.replace('am', 'am not');
});
Below is the code I used to replace some text, with colored text. It's simple, took the text and replace it within an HTML tag. It works for each words in that class tags.
$('.hightlight').each(function(){
//highlight_words('going', this);
var high = 'going';
high = high.replace(/\W/g, '');
var str = high.split(" ");
var text = $(this).text();
text = text.replace(str, "<span style='color: blue'>"+str+"</span>");
$(this).html(text);
});
var string ='my string'
var new_string = string.replace('string','new string');
alert(string);
alert(new_string);
Why you just don't add a class to the string container and then replace the inner text ? Just like in this example.
HTML:
<div>
<div>
<p>
<h1>
<a class="swapText">lollipops</a>
</h1>
</p>
<span class="swapText">lollipops</span>
</div>
</div>
<p>
<span class="lollipops">Hello, World!</span>
<img src="/lollipops.jpg" alt="Cool image" />
</p>
jQuery:
$(document).ready(function() {
$('.swapText').text("marshmallows");
});