I have already asked this question in offical Flot google groups, but got no answear. Maybe because it is more javascript oriented, here is the question:
I have added the following code in my code:
var j = "d";
j = j.sub();
plot1 = $.plot($("#grafTemp"), [
{label: "Rosišče (°C): T" + j + "(t) = ---.---°C"
.... the rest does not matter.
And:
legends.eq(i).text(series.label.replace(/=.*/, "= " + y.toFixed(2) +"°C"));
I was using this example:
http://people.iola.dk/olau/flot/examples/tracking.html
Now, the subscript works ok, it displays T_d fine. But when I update
the graph (when user moves mouse over graph), then it displays
<sub>d</sub>
I know that the problem is at the legends.eq(i).text....., where
it returns pure string, with literal:
<sub>
I would like to know, how it would be possible to fix this issue. So it would use html element sub properly?
Glancing at the code, it looks like you'd replace the use of text (e.g., legends.eq(i).text(...)) with html (legends.eq(i).html(...)). But you'd need to be sure that there aren't other generated bits of it that would be a problem (for instance, if this stuff generated a string that had a < or & in it, that would need to be converted to < / & respectively before being fed into the html function).
Related
I am pulling HTML code from a news page (within the same site) and am wanting to strip all the HTML tags from it. At present, all tags have beens stripped, except for special characters (&") etc. I have scoured all of the stackoverflow posts, and couldn't find anything that works. Perhaps it is the way I am defining the function.
I have tried using multiple variances to the - item.cleanedHtml = item.PublishingPageContent.replace(/</?[^>]+>/gi, '');
But the result either adds the HTML tags back, or doesn't display the text at-all. Within the [] I have tried adding " or just & to see if that would help. I have also tried changing the complete line with varying other suggestions that I could find, to no avail.
_blah.controller('myNewsController', ['$scope','newsService', function($scope,newsService) {
newsService.getNews().then(function(newsItems){
for (var i = 0; i < newsItems.length; i++) {
var item = newsItems[i];
item.cleanedHtml = item.PublishingPageContent.replace(/<\/?[^>]+>/gi, '');
item.cleanedHtmlFun = item.cleanedHtml.replace(/"/gi, '').replace(/'/gi, '');
item.imageUrl = getImageUrlfromSrc(item.File.Properties.PublishingPageImage,item);
}
$scope.news = newsItems;
});
}]);
I expect the output to read: As reported by Tom & Jerry
"What I am getting is: As reported by Tom & Jerry"
I'm following w3school beginner tutorial for JS. There's something I don't understand from code below:
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var cars = ["Saab","Volvo","BMW"];
var text = "";
for(var i = 0; i < cars.length; i++) {
text+=cars[i] + "<br>";
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
Can someone explain me the logic of text+=cars[i]? I understand that += means increment, but I can´t understand the logic behind adding the array element to variable text.
Thank you so much for your quick replies! I've got a follow up question: is there an alternative to display the same type of information with having to use the
var text = "";
and
text+=cars[i]
pieces of code? If so, how would the snippet of code look like and what should I insert into HTML if not
text
?
Thanks again!
a+=b is short for a=a+b. In your case you have text = text + cars[i] + "<br>".
text is a string, and you are using + to append a value from the array (that contains strings), and then append "<br>"
The value of text at the end of the loop is going to be
Saab<br>Volvo<br>BMW<br>
where br stands for line break. So that each of them gets printed on new line.
And the last line of code
document.getElementById("demo").innerHTML = text;
changes the value of html element which has id of demo to that of text.
text += cars[i] + '<br>';
Concatenates element i of the cars array to the text, separated by a <br> tag.
Consider it like this,
text+=cars[i] + "<br>";
is actually
text=text+cars[i]+"<br>";
so that rather than deleting the old value it will concatenate the new word with existing string.(String Concatenation).
PS:As a fellow beginner a small piece of advice rather than following W3 Schools please go to site like codecademy which helps you to learn along with practice and proper explanation.
Don't think of += as incrementing, that's ++.
a = a + b
a += b;
Those two statements are the same. The bottom one takes the variable on the left side (a) and appends the right side to it (b), and then assigns it all back to he left side (a). So it's just a shorthand.
So what you're doing in your code is appending the string from cars[i] to your variable text.
This would do the same thing:
text = text + cars[i] + "<br>";
Once the loop runs, you will have the following in text:
Saab<br>Volvo<br>BMW
In javascript + is used for string concatenation
The code
for(var i = 0; i < cars.length; i++) {
text+=cars[i] + "<br>";
}
is picking each element from the array and concatenating "" to it.
If you console log the text before setting the innerHTML, it looks something like this -
"Saab<br>Volvo<br>BMW<br>"
here they do it actually just to show theres no point of doing it this way they just wanna show to reach each individual inside an array and concatanate it into a string the very same thing you can do with Array.prototype.join() method dont think here that u must use as they show always concatanate into a string if you want you can simply use every single individual inside as u wish as well
+= is not increment. It's adding (in this case concatenation) and saving result in the same variable.
var a +=b;
Is the same to:
var = a + b;
In your case script concatenates all array elements into one string and adding <br> tags between them.
I have some code which creates a 'typing text effect' on a page - i.e. javascript takes a string and outputs it on the screen in a way that makes it look like it is being typed. I took the code from a demo here.
The problem is that I want it to output html code, e.g. the output on the screen should be something like:
<html>
<body>
Something here etc etc...
</body>
</head>
In chrome, this works in a rather erratic fashion - sometimes it works perfectly, but other times it doesn't display the first left angle bracket, leaving me with the output of 'html>' rather than '<html>'. In safari, the left angle bracket doesn't display at all. I've tried various things, using '<' instead of the bracket, using unicode, but that everything I do seems to end with the same result.
Here is a github gist of the code, and here is a bl.ocks page to showing it in action. I tried to make a jsfiddle but couldn't get it to run properly, sorry!
Any help is much appreciated, it's been driving me nuts.
Cheers
Nick
Instead of
$span.append(thisLine[letterIndex]);
try
$span.text($span.text() + thisLine[letterIndex]);
Or, per crush's comment below, you could do a string replace:
$span.append(thisLine[letterIndex].replace(/</g,'<').replace(/>/g,'>'));
This works because when you want to display HTML tags, you need to use < and > rather than just < and >, otherwise the browser thinks you're putting in an actual HTML tag, if that makes sense to you. The jquery text method automatically escapes the brackets for you, and in my second example, we're just doing a string replace before passing the string to append.
It looks as if the code appends '<' as '&','l','t',';'. Not verified this but you might want to try:
function typeLetter(lineIndex, letterIndex, $span, line, callback) {
var thisLine = line;
var thisLength = line.length;
var chunk='';
// add the letter
chunk=thisLine[letterIndex];
if ('&'==thisLine[letterIndex]) {
for (var i=1; i<5; i++) {
letterIndex++;
chunk+=thisLine[letterIndex];
if (';'==thisLine[letterIndex] || letterIndex>=thisLength-1) break;
}
}
$span.append(chunk);
...
I'm using the Wikipedia API to fetch just the first para of an article for which a keyword has been provided.
I have to extract formatted text from the JSON response but suppress some of the unwanted info like the sidebar (which is in a table & has the class name infobox) before I show it in a div whose id is wiki -
$.getJSON("http://en.wikipedia.org/w/api.php?" +
"action=mobileview&format=json&page=" +
keyword + "&redirect=no§ions=0&prop=text&" +
"sectionprop=toclevel%7Clevel%7Cline%7Cnumber" +
"%7Cindex%7Cfromtitle%7Canchor&callback=?",
function(json) {
$('#wiki').html(json.mobileview.sections[0].text)
.find("dl,sup,.thumb,table.infobox,table.metadata")
.remove().end();
}
);
I've adapted the jQuery trick to remove tags/selectors from the JSON response containing the HTML code of the requested Wikipedia page. I want to use the above snippet in a Windows 8 Store app written in HTML/JS. I wish to convert the following line to native JavaScript and implement the selector removal code without using jQuery -
$('#wiki').html(json.mobileview.sections[0].text)
.find("dl,sup,.thumb,table.infobox,table.metadata")
.remove().end();
I'm a JavaScript newbie. Can anyone please convert this line to plain-vanilla JavaScript?
var wiki = document.querySelector('#wiki');
wiki.innerHTML = json.mobileview.sections[0].text;
var content = wiki.querySelectorAll("dl,sup,.thumb,table.infobox,table.metadata");
for (var i = 0; i < content.length; i++) {
if (content[i].nodeName.toUpperCase() === "A")
content[i].parentNode.insertBefore(content[i].firstChild, content[i]);
content[i].parentNode.removeChild(content[i]);
}
This will work in most browsers including IE8 and higher.
I have a question concerning my javascript code (Sorry my english is not that good). The code works, however, with only one data entry, the string in the HTML which results, gets cut off near the end (last few characters seems to be dropped, the length of the character drop is consistent). I'm wondering if I'm hitting a string limit or something similar. The problem data entry (which gets stored in the var gDef below) is 4110 characters long which doesn't seem like it should be a problem... Help?
The following is my code:
gI = document.gForm.gLinks.options[document.gForm.gLinks.selectedIndex].value;
definition = "";
gWord = (g[gI].getElementsByTagName("NAME")[0].childNodes[0].nodeValue);
gDef = (g[gI].getElementsByTagName("DEFINITION")[0].childNodes[0].nodeValue).replace(/\n/g,'<br />').replace(/\[/g,'<').replace(/\]/g,'>');
definition += ("<div class=\"word\">");
definition += ("<h3>"+gWord+"</h3>");
definition += ("<div class=\"definition\">"+gDef+"</div>");
definition += ("</div>");
document.getElementById("showGlossary").innerHTML = definition;
Are you sure that the browser isn't hiding the string partially? The CSS property text-overflow can cause this.