Javascript Special Character removal not working - javascript

i have written a jsp code with values coming from other jsp and i need to remove the special characters in the string.But iam not able to remove special characters. Please help
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
<script>
function change(chars){
var dchars=document.getElementById("chars").value;
dchars = dchars.replaceAll("!##$%^&*()+=[]\\\';,/{}|\":<>?", '');
document.getElementById("chars").innerHTML=dchars;
}
</script>
</head>
<%
String res=request.getParameter("tes");
%>
<body onload="change(chars)" ><script>
change(res)
</script>
<div id="chars"> <%=res%></div>
</body>
</html>

There is no "value" for div elements. You need to use innerHtml insted:
document.getElementById('chars').innerHTML = dchars;

try this....
document.getElementById('chars').innerHTML = dchars; //div has no value..
Assuming by special characters, you mean anything that's not letter, here is a solution:
alert(dchars.replace(/[^a-zA-Z ]/g, ""));
OR
alert(dchars.replace(/[^a-z0-9\s]/gi, '')); //will filter the string down to just alphanumeric values

The problem with using innerHTML is that certain characters are automatically converted to HTML entities such as & which is converted to &
function cleanCharsText(){
var el = document.getElementById("chars");
var txt = el.innerText || el.textContent;
el.innerHTML = txt.replace( /[!##$%^&*()+=\\[\]\';,/{}\|\":<>\?]/gi, '');
}
However if you have the following <span> text </span> inside your chars element the html span tags will be removed when you run the above function as we are only extracting the text.

Related

javascript string - remove PHP instructions leaving only the HTML elements

I want to repopulate the html DOM from a string that contains PHP and HTML code using js.
var string = "<?php echo Hi Friends ?>
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript" src="js/loader.js" defer></script>
</head>
<body>
<p>Hello</p>
<?php echo Hi Friend ?>
</body>
</html>";
Desired output:
var string = *strip away all php*;
var string = "<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript" src="js/loader.js" defer></script>
</head>
<body>
<p>Hello</p>
</body>
</html>";
window.body.innerHTML = string;
I would expect only the html code to be rendered.
Here is a method that works:
Turn your string into an array by .split() on the endline char:
var arr = string.split('\n');
Loop through the array, using this regex to remove any PHP strings
let cln = arr[i].replace(/(.*)(<\?.*\?>)(.*)/, "$1$3");
Store each "cleaned" line into a new array
Explanation of the RegEx (step 2)
() - represents a "capture group" (each line will be split into three captured groups)
(.*) - the first group contains all the characters from the beginning UNTIL...
(...) - the 2nd capture group contains from <? to ?> and all chars in between (i.e. a PHP string)
(.*) - the 3rd group contains any characters following a PHP string
$1 $2 $3 - are the contents of the three capture groups
So, each line (as it is processed by the for loop) is split up into these three groupings of characters.
On MOST of the lines, groups 2 and 3 are empty. Group 1 is the entire line. So, returning group 1 and group 3 returns the entire line.
On lines that contain a PHP string, the PHP is in capture group 2 (which is never returned). Returning group 1 and group 3 either returns an empty string, or it might return some spaces that preceeded or followed the PHP string. So, we also use .trim() to remove those. If the line with spaces removed is zero-length, we do not include in the new (output) array.
var htm = `<?php echo Hi Friends ?>
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript" src="js/loader.js" defer> </head>
<body>
<p>Hello</p>
<?php echo Hi Friend ?>
</body>
</html>`;
//console.log(htm);
var out=[], arr=htm.split('\n');
for ( var i=0; i<(arr.length); i++ ){
let cln = arr[i].replace(/(.*)(<\?.*\?>)(.*)/, "$1$3");
//console.log(cln + ' - ' + cln.trim().length);
if (cln.trim().length>0){
out.push(cln.trim());
}
}
console.log(out.join("\n") );
I believe this will work for you using regex and the replace prototype. One note on the way your string is constructed, you will want to replace the quotations(") that they're wrapped with and substitute with the acute symbol(`)
string.replace(/\<\?php.*>/g,'');

How to display string length in javascript

I am new to javascript, and today i was trying my first example as shown below in the code section. I am using an editor called "Free Javascript Editor".
when I run the code, the browser starts and the text between the tags is displayed but the length of the string is never shown.
am I using it wrong?? please let me know how to do it correctly
lib
compile 'io.reactivex.rxjava2:rxjava:2.0.1'
compile 'io.reactivex.rxjava2:rxandroid:2.0.1'
code:
<html>
<head>
<title>Title of the home pahe</title>
</head>
<body>
<script>
var str = new string ("MyString");
str.length;
</script>
<h2>My First JavaScript</h2>
</body>
</html>
Use Onload event and put it inside js function.
<body onload="myFunction()">
<script>
function myFunction() {
var str = ("MyString");
var n = str.length;
document.getElementById("printlength").innerHTML = n;
}
</script>
<h2>My First JavaScript</h2>
<p id="printlength"></p>
</body>
Use document.createElement
var str = "MyString";
var p = document.createElement("p");
p.textContent = str.length;
document.body.appendChild(p);
Scripts are not rendered by the browser, only executed. You can, however, do something like this:
<html>
<head>
<title>Title of the home pahe</title>
</head>
<body>
<h2>My First JavaScript</h2>
<p id="theLength"></p>
<script>
// No need to invoke the string constructor here.
var str = 'MyString';
// Find our placeholder element and set the textContent property.
document.getElementById('theLength').textContent = str.length;
</script>
</body>
</html>
It's good practice to put your script tags at the end of the body element - that way all of the HTML should render before the scripts are executed.
You should assign the length of your string to a variable. Then, you can show it.
<span id="stringLength"></span>
<script>
var str = "MyString";
var length = str.length;
document.getElementById('stringLength').textContent = 'Length: ' + length; // Show length in page
console.log('Length: ' + length); // Show length in console
alert('Length: ' + length); // Show length as alert
</script>
It must be String, not string. Code below works.
var str = new String ("MyString");
str.length;
Changed your code to this:
<html>
<head>
<title>Title of the home pahe</title>
</head>
<body>
<script>
var str = "MyString";
console.log(str.length);
</script>
<h2>My First JavaScript</h2>
</body>
</html>
Then you must look in the developer console for the output, here is how:
Google Chrome
FireFox
Safari

Retrieve text from search box

I'm building a program that allows me to search a document to see how many times a word appears within that document. I would like to choose which word to search by entering the desired word into a search box that I've built. Currently, If I hard code the word that I'm searching for, it'll search the document and tell me how times it appears. If I try to use the search box to enter a word, I always get a result of 0. I need a way to retrieve the word entered from the search box and use that word as the word that I want to check.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>WordBubble</title>
<link rel="stylesheet" type="text/css" href="wordbubble.css">
<script type="text/javascript" src="jquery-1.10.2.js"></script>
</head>
<body>
<div id="search">
Search Word: <input type="search" name="Wordsearch" size="35">
<button type="submit" class ="searchme">Search</button>
</div>
<script type="text/javascript">
$(document).ready(function(){
$(".searchme").click(function(){
var myWord = $ (this).text();
findDuplicates();
});
});
// ajax call to get comments document
function findDuplicates (myWord) {
$.get( "comm.txt", function( text ) {
words = text.split(' '),
sortedWords = words.slice(0).sort(),
duplicateWords = []
for (var i=0; i<sortedWords.length-1; i++) {
if (myWord == sortedWords[i]) {
duplicateWords.push(sortedWords[i]);
}
}
$( "p" ).html(duplicateWords.length);
});
}
</script>
<p></p>
</body>
</html>
In your click-handler you retrieve the searchstring from the button instead from the input.
$(document).ready(function(){
$(".searchme").click(function(){
// get the word from the input
var myWord = $('input').val();
findDuplicates(myWord);
});
});

How to remove <script> tags from an HTML page using C#?

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
if (window.self === window.top) { $.getScript("Wing.js"); }
</script>
</head>
</html>
Is there a way in C# to modify the above HTML file and convert it into this format:
<html>
<head>
</head>
</html>
Basically my goal is to remove all the JavaScript from the HTML page. I don't know what is be the best way to modify the HTML files. I want to do it programmatically as there are hundreds of files which need to be modified.
It can be done using regex:
Regex rRemScript = new Regex(#"<script[^>]*>[\s\S]*?</script>");
output = rRemScript.Replace(input, "");
May be worth a look: HTML Agility Pack
Edit: specific working code
HtmlAgilityPack.HtmlDocument doc = new HtmlAgilityPack.HtmlDocument();
string sampleHtml =
"<html>" +
"<head>" +
"<script type=\"text/javascript\" src=\"jquery.js\"></script>" +
"<script type=\"text/javascript\">" +
"if (window.self === window.top) { $.getScript(\"Wing.js\"); }" +
"</script>" +
"</head>" +
"</html>";
MemoryStream ms = new MemoryStream(Encoding.ASCII.GetBytes(sampleHtml));
doc.Load(ms);
List<HtmlNode> nodes = new List<HtmlNode>(doc.DocumentNode.Descendants("head"));
int childNodeCount = nodes[0].ChildNodes.Count;
for (int i = 0; i < childNodeCount; i++)
nodes[0].ChildNodes.Remove(0);
Console.WriteLine(doc.DocumentNode.OuterHtml);
I think as others have said, HtmlAgility pack is the best route. I've used this to scrape and remove loads of hard to corner cases. However, if a simple regex is your goal, then maybe you could try <script(.+?)*</script>. This will remove nasty nested javascript as well as normal stuff, i.e the type referred to in the link (Regular Expression for Extracting Script Tags):
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
if (window.self === window.top) { $.getScript("Wing.js"); }
</script>
<script> // nested horror
var s = "<script></script>";
</script>
</head>
</html>
usage:
Regex regxScriptRemoval = new Regex(#"<script(.+?)*</script>");
var newHtml = regxScriptRemoval.Replace(oldHtml, "");
return newHtml; // etc etc
This may seem like a strange solution.
If you don't want to use any third party library to do it and don't need to actually remove the script code, just kind of disable it, you could do this:
html = Regex.Replace(html , #"<script[^>]*>", "<!--");
html = Regex.Replace(html , #"<\/script>", "-->");
This creates an HTML comment out of script tags.
using regex:
string result = Regex.Replace(
input,
#"</?(?i:script|embed|object|frameset|frame|iframe|meta|link|style)(.|\n|\s)*?>",
string.Empty,
RegexOptions.Singleline | RegexOptions.IgnoreCase
);

Javascript - Replace html using innerHTML

I'm trying to replace html using innerHTML javascript.
From:
aaaaaa/cat/bbbbbb
To:
Helloworld
This's my code
<html>
<head>
</head>
<body>
<p id="element1">aaaaaa/cat/bbbbbb</p>
<script language="javascript">
var strMessage1 = document.getElementById("element1") ;
strMessage1.innerHTML = strMessage1.innerHTML.replace( /aaaaaa./g,'<a href=\"http://www.google.com/') ;
strMessage1.innerHTML = strMessage1.innerHTML.replace( /.bbbbbb/g,'/world\">Helloworld</a>') ;
</script>
</body>
</html>
When i run this code it disappears Helloworld hyperlink.
what I'm doing wrong. Please help.
Thank you for all your help.
You should chain the replace() together instead of assigning the result and replacing again.
var strMessage1 = document.getElementById("element1") ;
strMessage1.innerHTML = strMessage1.innerHTML
.replace(/aaaaaa./g,'<a href=\"http://www.google.com/')
.replace(/.bbbbbb/g,'/world\">Helloworld</a>');
See DEMO.
You are replacing the starting tag and then putting that back in innerHTML, so the code will be invalid. Make all the replacements before you put the code back in the element:
var html = strMessage1.innerHTML;
html = html.replace( /aaaaaa./g,'<a href=\"http://www.google.com/');
html = html.replace( /.bbbbbb/g,'/world\">Helloworld</a>');
strMessage1.innerHTML = html;

Categories