How to remove HTML from scripts? - javascript

So, I have a script with both HTML and javascript inside:
<script>
<br>
window.onload = myFunction;
<br>
function myFunction() {
// Do something
}
<br>
</script>
Obviously, the HTML dont work, but can I remove the HTML tags in scripts somehow? With the javascript code still working. (and not by just going into the code and removing the HTML myself). Is there a way to make the HTML go away or be invisible to the script?
(I've tried just commenting it out with the "< ! - -" and "- - >" but it doesn't work)
Edit: the reason I'm wondering is because I have a weird coding teacher... and he told me you could do stuff like that but I can't get it to work. So I just want to know if it's actually possible.

Commenting the code using javascript comment tags /*
<script>
/*
<br>
window.onload = myFunction;
<br>
*/
function myFunction() {
// Do something
}
<br>
</script>

Related

Indentation in emacs for html with inline javascript

Here is roughly the kind of code that I have.
<body>
<p>
...
</p>
<script>
function func()
{
...
for(...)
{
...
}
}
</script>
<p> ... </p>
</body>
HTML by itself indents properly, but when I put in the javascript everything screws up.
How do I deal with this?
You could try one of the multiple modes:
https://emacswiki.org/emacs/MultipleModes
http://wikemacs.org/wiki/JavaScript#Mix_html_and_Javascript
https://github.com/purcell/mmm-mode
https://github.com/vspinu/polymode
https://github.com/fgallina/multi-web-mode
Their goal is to have more than one mode at the same time in the same buffer, specially html and javascript.
What I tend to do is have blank lines in between my script tags and then switch over to javascript mode. The html would look like this with the blank line padding
<script type="text/javascript">
//some javascript
</script>
That seems to allow correct coloring and indenting. I also like to use js3-mode personally as it adds a bit more functionality than emacs' default javascript styling.

How to add Javascript into Blogger pages?

I have made a blog using blogger and now I want to customize it. All I want is to be able to add a button having Javascipt's onclick() in blogger's page behind HTML. I tried all the tricks but it is somehow not working.
<div>
<div>
<img src="C:\Users\dell\Desktop\goldfavicon.jpg" height="98px" width="98px"/>
</div>
<div>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
var btn = document.createElement("BUTTON");
window.open("http://www.amazon.com/tinny-tots-baby-bottle-cover/p/itme3h9rvenhxvxb?pid=BTCE3H9RGFD3Z7JR","_self")
}
</script>
</div>
</div>
I had the same problem recently.
You need to wrap your script like so
<script type='text/javascript'>
//<![CDATA[
function myFunction() {
var btn = document.createElement("BUTTON");
window.open("http://www.amazon.com/tinny-tots-baby-bottle-cover/p/itme3h9rvenhxvxb?pid=BTCE3H9RGFD3Z7JR","_self")
}
//]]>
</script>
The term CDATA tells the XML parser not to parse the wrapped text data. For more info on CDATA, check this answer.
Also I followed this advise:
Adding Scripts in Blogger is extremely straightforward. All you need
to do is to go to Blogger.com >> Your site >> Template >> Edit HTML.
Now it depends on you where you would like to paste your JavaScript
coding. However, we prefer you to add it above the tag because
this is the place where all technical things are present.
Hope it helps.

Why won't JavaScript run?

I was making an HTML code editor, I tested all of the HTML tags I know and they all work, except for script tags.
When I type <script>something</script> into the text area and click a button, the script doesn't execute.
Please help! Here is the code:
<span id="finishedProduct">
<p>When you enter code, your finished product will be here! Don't worry, if you make a mistake you can fix it later!</p>
</span>
<form name="userCode">
<textarea name="userCode" cols="90" rows="20" placeholder="Type your code here"></textarea></br>
<button type="button">Run Code!</button>
</form>
<script>
function makeCode() {
var userCode=document.forms["userCode"]["userCode"].value;
document.getElementById('finishedProduct').innerHTML = userCode;
}
</script>
Here is the working code:
<span id="finishedProduct">When you enter code, your finished product will be here! Don't worry, if you make a mistake you can fix it later!
</span>
<form name="userCode">
<textarea name="userCode" cols="90" rows="20" placeholder="Type your code here"></textarea>
<br/>
<button type="button" onClick="makeCode()">Run Code!</button>
</form>
<script type="text/javascript">
function makeCode() {
var userCode=document.forms["userCode"]["userCode"].value;
document.getElementById('finishedProduct').innerHTML = userCode;
}
</script>
Here's a link to the JSFiddle: http://jsfiddle.net/Q2qLF/. I've removed some broken HTML, such as; a button shouldn't be contained in a anchor tag, I've added a 'onclick' in your button that will call the 'makeCode()' function and I've added the 'type="text/javascript"' into your script tag as this maximises compatibility.
Please let me know if you need any more help
I've updated my JSFiddle http://jsfiddle.net/Xanco/Q2qLF/1/
Now there are 2 textareas, one for the HTML and one for the Javascript. i've also created a new function called 'makejs', this takes the value of the Javascript textarea and runs it through a 'eval' - this executes the Javascript passed to it.
I've put the answer in a Fiddle here: http://jsfiddle.net/joshnicholson/P8eh9/
I'm not sure why you're wrapping the button element inside an anchor, but I would do it a slightly different way.
Here is the revised javascript:
var myButton = document.getElementById("btnRunCode");
myButton.addEventListener("click", makeCode);
function makeCode() {
var userCode=document.forms["userCode"]["userCode"].value;
document.getElementById('finishedProduct').innerHTML = userCode;
}
I added an id of "btnRunCode" to your button element, just to make things easier for me. See the Fiddle.

Dynamically generated script not working

I have a contenteditable div where you type javascript which gets outputted into an empty script tag.
<div contenteditable="true" id="script-generator"></div>
<div id="save-script">Save</div>
<script type="text/shorthand" id="script">
</script>
So you write your script in the div, click save and I have some JS which gets the html of the contenteditable div and adds it to an empty script tag.
$('#save-script').click(function() {
var script = $('#script-generator').html();
$('#script').html(script);
});
So far this works. But the generated script has no effect. The browser must not recognise the script because it wasn't there on page load? How do I make the script take effect without reloading the page?
Note: The type/shortand on the script is because I'm using a plugin which converts shortand words into actual Javascript. So the user would just need to write shorthand into the contenteditable div, and the plugin would convert that to JS. This might be adding to the problem?
I don't think it works to modify an existing <script> element. If you want the script to be executed you need to add a new element.
$('#save-script').click(function() {
var script = $('#script-generator').html();
$("#script").text(script);
ShortHand.parseScripts();
});
Correct - you need to create the script tag to have it execute after load.
$('head').append($('<script />', {html: script}));
...which means you can remove your empty script tag.
I have set up a test that's similar to what you have been looking for. Take a look and see if that helps.
Working Demo
Test code:
<div id="script" style="display:none">
alert(4+4);
</div>
<input id="sLoad" type="button" value="Load/Execute Script" />
$('#sLoad').click(function(){
//You may want to append to the head
$('<script/>').append( $('#script').html() ).appendTo('#script');
});

Remove all content between <script type="JavaScript">abcd</script> tags

I want to remove all things or content between <script>want to remove</script>
I have very small amount of knowledge about php & java script so please give me a complete codes I have no idea how to use php or JavaScript coding to remove content between <tags></tags>
I found this box and copy in my website they remove all tags but I not want this I want only remove content between tags.
Please any one modify this box or script to remove content between <tags></tags> or give me other script.
<script type="text/javascript">
// Strip HTML Tags (form) script- By JavaScriptKit.com (http://www.javascriptkit.com)
// For this and over 400+ free scripts, visit JavaScript Kit- http://www.javascriptkit.com/
// This notice must stay intact for use
function stripHTML(){
var re= /<\S[^><]*>/g
for (i=0; i<arguments.length; i++)
arguments[i].value=arguments[i].value.replace(re, "")
}
</script>
<form>
<textarea name="data1" style="width: 400px; height: 100px"></textarea><br />
<input type="button" value="Remove any HTML tags" onClick="stripHTML(this.form.data1)">
</form>
you could try:
document.getElementsByTagName('script')[0].innerHTML = '';
According to your code block you posted, it seems that you would like to strip script tags from the value of a form element (e.g. a textarea). Sanitizing user input on client side is generally considered to be a bad idea, because this kind of security measure can be easily bypassed. A better solution would be stripping the script tags from the posted data on the server side.
Here is an example in php:
$data = $_POST['fieldname'];
$outputData = strip_tags($data, array(/* here you can specify the allowed html tags, all others will be stripped */);
echo $output;

Categories