I need to put a MathJax equation into the innerHTML element.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Tools for Operation Research</title>
<script type="text/javascript" src="D:/_Installers/MathJax-2.7.7/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
</head>
<body>
<section id="main_content">
Put text here:
</section>
<script>
document.getElementById("main_content").innerHTML = "The expresion is: <br> $$\displaystyle Q^*=\sqrt{\left( \frac{2DA}{h}\right)\left(\frac{1}{1-\frac{D}{\psi}}\right)\left(\frac{h+\pi}{\pi}\right)}$$";
</script>
</body>
The result is this:
$$displaystyle Q^*=sqrt{left( rac{2DA}{h} ight)left(rac{1}{1-rac{D}{psi}} ight)left(rac{h+pi}{pi} ight)}$$
not the equation.
Shoulb be something like this:
Correct equation
JavaScript Compiler unescapes backslash escaping
Because JavaScript uses backslash escaping, all the '\' characters before unrecognized letters in the equation are being removed by the JavaScript compiler, and '\r' is turned into an ASCII carriage return character which HTML then displays as whitespace.
The solution is to backslash escape the backslashes in the equation:
<script>
document.getElementById("main_content").innerHTML = "The expresion is: <br> $$\\displaystyle Q^*=\\sqrt{\\left( \\frac{2DA}{h}\\right)\\left(\\frac{1}{1-\\frac{D}{\\psi}}\\right)\\left(\frac{h+\pi}{\\pi}\\right)}$$";
</script>
Note I was able to verify the equation was displayed as symbols using a downloaded copy of MathJax from a CDN, but did not attempt a local installation.
Related
Assume, you want to shown an alert with the string content of <!-- Comment --> <script type="text/javascript"></script> in JavaScript on a HTML page. You can do that with the following code:
<!DOCTYPE html>
<html>
<head>
<title>Quoting</title>
</head>
<body>
<script type="text/javascript">
alert('<!-- Comment --> <script type="text/javascript"></script\u003E');
</script>
</body>
</html>
Note here the quoted > character in the </script> part of the text. This uses a JavaScript Unicode escape to prevent the HTML parser from interpreting this part of the string literal as the end of the script tag. The code above works perfectly in FF, Chrome, IE.
Now try to apply the > quoting also to the end of the comment within the string literal. This should change nothing, because the XML comment syntax should not be interpreted within script tags in HTML (and obviously is not interpreted, because the comment syntax was shown in the alert):
<!DOCTYPE html>
<html>
<head>
<title>Quoting</title>
</head>
<body>
<script type="text/javascript">
alert('<!-- Comment --\u003E <script type="text/javascript"></script\u003E');
</script>
</body>
</html>
Interestingly, this code breaks - the alert is not printed when the page loads. The problem can be reproduced at least in FF, Chrome and IE. Am I missing something in the specs, or is that a "browser-independent" bug in the HTML parser of all major browsers?
The DOM inspector shows the following:
It looks like the rest of the document is interpreted as part of the script in this case.
Any ideas?
This is not a bug.
The first < puts the parser into Script data less-than sign state then the ! puts it in script data escape start state and so on.
Replacing the > that ended the HTML comment with an escape sequence means it doesn't come out of the "dealing with a comment" state until it hits the end of the HTML document.
It is a historical artefact of the hack early HTML used to allow inline scripts without the JS source code showing up on the page for browsers which didn't support the <script> element.
I am using the below script to convert "." into "।" which is the Hindi stop symbol. I am using this code in a blogger post, The script code converts this dot (.) symbol into HTML entity code on blogger post and gives me code like below
।
When I am using pipe | in place of ।, it works perfectly and there is no error. But pipe "|" is not the right symbol for a full stop in Hindi.
Kindly suggest converting "." into "।" that is for a blogger like similar code
Please correct me If I am wrong. I don't have much knowledge of JavaScript and Jquery.
I have used some below code and it works here fine but it did not work on the platform Blogger
Please suggest me the appropriate solution
<!doctype html>
<html dir='ltr' lang='en-GB'>
<head>
<meta charset="UTF-8">
<title>test page</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(function() {
$('textarea').on("keyup", function(e) {
var val = $(this).val();
var str = val.replace('.', '।');
$(this).val(str);
});
});
</script>
</head>
<body>
<textarea></textarea>
</body>
</html>
I need to add a closing image tag. Current html:
<img class="logoEmail" src="/images/logoPDF.png">
What I want:
<img class="logoEmail" src="/images/logoPDF.png"/>
How can I do that?
myInput ='<img class="example1" src="/images/example1.png">';
myInput += '<img class="example2" src="/images/example2.png"/>';
result = myInput.replace(/(<img("[^"]*"|[^\/">])*)>/gi, "$1/>");
Explanation of the regex:
<img The start
"[^"]*" A string inside the tag. May contain the / character.
[^\/">] Anything else (not a string, not a / and not the end of the tag)
> The end of an IMG tag
This will only match unfinished tags, and will replace it by the whole thing, plus a />
As I said before this is NOT bulletproof, probably there is no regex that would work 100%.
You could try this regex also,
result = myInput.replace(/^([^\.]*\.[^>]*)(.*)$/g, "$1/$2");
DEMO
It captures all the characters upto a literal dot and stored it into a group. Then it again captures characters upto > and stored into another group. Add a / in between the captured groups in the replacement part will give you the desired output.
It can be as easy as this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Demo Replace IMG tags w/ regex</title>
<script type="text/javascript">
window.onload = function() {
document.body.innerHTML = document.body.innerHTML.replace(/(<img[^>]+)/g, "$1 /");
}
</script>
</head>
<body>
<p>Some text.</p>
<img src="images/logoPhone.jpg">
<br>
<img src="images/logoMail.png">
<p>Some more text.</p>
</body>
</html>
.
Explanation:
<img: match must start with this.
[^>]: after the starting match, the next character may be anything but >.
+: one or more occurances.
g: apply globally, do not return on the first match.
$1: as in the first capture group (= stuff between first set of parentheses).
.
Be aware that Firebug never shows closing slashes, regardless of doctype. But you can see the regex script in action here: http://regex101.com/r/zS2zO1.
I've been struggling to understand how to render Katex without having to use $$ before and after the math expression. Katex on github says I should use this:
<script>
renderMathInElement(document.body);
</script>
But I still need to use $$ for each line of code. How can I render the whole page as katex? Thank you!
Here's a simple example. If you paste this code in an HTML file and then open that file in a browser, it should render, and with no occurrences of $$ anywhere to be found, so hopefully you can then tweak it to whatever you need.
Not sure why, but I needed to use \\ wherever I found \ on the Katex function support page, so if \\ doesn't work for you, try switching it to \.
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/katex.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/katex.min.js"></script>
</head>
<body>
<span id="formula">f(x)</span>
<script>
katex.render("\\int_0^1{f(x)}", formula);
</script>
</body>
</html>
is there a way of getting all the content of the page HTML , CSS , but exclude all the java script functions and script src?
var htmlPage = $("html").html();
console.log(htmlPage);
I know that will give me all of it. but I need to exclude the JS from the results
EDIT: fixed the regex (non-greedy version)
You can try this:
var htmlPage = $("html").html().replace(/<script[\s\S]*?<\/script>/mig, "");
The regular expression should match all <script> ... </script> tags and replace them with nothing.
BTW this is kind of a lucky shot because the regex itself requires the ending </script> to be escaped with a \ backslash like this: <\/script>.
This escape character is why the regex doesn't match itself, which would cause it to fail. So, it works because by escaping it correctly it isn't self-similar anymore.
Another option is to use Element.innerHTML and include the content that you want to get. For example:
<!doctype html>
<html>
<head>
<!--Css links goes here-->
</head>
<body>
<!--Your content-->
<p>Hello World</p>
</body>
<script>
//Js
</script>
<html>
var body = document.body.innerHTML;
var head = document.head.innerHTML;
Then you can concadenate or whatever you want.