get Javascript to not appear as code on the page - javascript

I don't know much about this, just having recently started with JavaScript, so simple language would be greatly appreciated.
Whenever I insert JavaScript on a page, it appears in the preview as text on the page and when I update my site it also appears this way. How would I fix this?
Thank you in advance.

There are two ways to inject JavaScript into a page.
Inline in either the head or body of your html page.
<script type="text/javascript">
alert('this is inline javascript');
</script>
Or you can link to an external JavaScript file from the head of your html document.
<script type="text/javascript" src="path/to/script.js"></script>
Just remember: if the javascript is an external file, save it with the .js extension.

Do you have it within <script type="text/javascript"></script> tags?

You need to provide a sample of what you are doing for us to help you.
However, you might check that your script declaration looks something like this:
<script type="text/javascript">
<!-- //html comment hides script from really old browsers
myVar = resultsFromAMethod();
//-->
</script>

Related

Why my script.js file doesn't work but the JavaScript code inside of the index.html file works?

When i add this:
<script src="script.js"></script>
<script src="jquery-3.5.1.min.js"></script>
to my index.html file in the head of the file, and i create a JavaScript file, it looks like the html doesn't recognize it.
But when i add this:
<script type="text/javascript">
//code
</script>
to my index.html file in the body of the file, all of the code i done in JavaScript works.
Can somebody explain why this happens?
It’s always a good practice to add jQuery code just before the closing </body> tag. If you have not done that, then use the defer attribute.
Also if you’re writing jQuery code make sure that your code is placed after the jQuery link code.
Don't add your JS files in the head. You are most likely going to be accessing DOM elements, and those elements are defined in the HTML. If you insert a script above the html, the elements won't be recognized because they're not defined yet. Add all of your scripts after the body, I add mine after the closing html just to be safe. And please add your script after your jQuery script.

Adding a JavaScript embed to HTML

I am given this code which should display an embedded small coupon version of this page https://weedmaps.com/deals#/1118217:
<script type="text/javascript">var coupon_id = 17811;</script>
<script type="text/javascript">var coupon_type = "deliveries";</script>
<script type="text/javascript" src="https://weedmaps.com/embed/coupon.js"></script>
I do not know how to add the JavaScript to the HTML correctly. I have placed the following scripts in the head section. But I don't understand how to have the coupon generate in the div I want it to. I have tried calling the JavaScript function, but I've never worked with JavaScript before. Could someone please help me embed this coupon.
I've taken a look at your script and first of all: it definitely should be placed inside the document and not into the <head> section because coupon.js is writing out html at the placement of the coupon.js script import.
In theory you just need to place the script and it should work but there are some problems:
You need to execute it on a web server - when running as a plain html file the script just tries to find the libraries in your file system which does not work.
It still would not work because it would still try to find some resources at your web-server. In mycase it the script tried to load http://localhost:63342/restpoints/deliveries/17811/deal which will not work
To prove 2. just try https://weedmaps.com/restpoints/deliveries/17811/deal with the correct domain. Then you are receiving correct JSON which is used to fill the coupon pane.
=> Consequently the script you were given has problems if it should be executable from domains different from "weedmaps.com"
Javascript can be between head tag but it advisable to put it below before the body closing tag, to allow your page contents loads first before loading javascript. Just import your javascript. and call out. Hope this was helpful.
<!DOCTYPE html>
<html>
<head>
</head>
var coupon_id = 17811;
The JS indicates it is looking for an element with an id of #weedCouponPane. Do you have this in your html? i.e.
<div id="weedCouponPane"></div>

Java script doesn't work on an external sheet but it works on the main html file. Why is that and how do I fix it?

Here is my first main html code
Main HTML file picture
and here is my second of my external file
$(document).ready(function() {
alert("hello");
});
I already tried putting the alert outside of the document ready function it still doesn't work.
I don't know why only the first one works please help. Also when I opened up my devtools and went to console it had a lot of but i can't put most of them because I don't have enough reputation to post more than one link. But here is one,
GET http://online-dnbard.rhcloud.com/tick/5620f410e59615263f000006 net::ERR_NAME_NOT_RESOLVED
ps. I am using brackets.
Note That you load up your external js file before jquery:
<script src="Javascript.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
When you load up your file, you reffer to "$(document).ready", which isn't defined yet, so your browser throws an error.
Just change the order:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="Javascript.js"></script>
ps. Using the console in the future will save you a lot of time ;)

Using jQuery in Cloud9

I am teaching myself how to program usign JS, jQuery, HTML and CSS. I downloaded the jquery-master from github and use it in my project, however I still cannot get it to import into my HTML files so that I can utilize it. Does anybody know how? Any help would be appreciated!
you can use this js file you donot need to download js files you just need to place this script tag to each html page where you are trying to play with jquery code.
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
use this script and include your jquery code inside this script block
<script type="text/javascript"> alert('hi friend') </script>
hope this will works Thanks.

Including JavaScript

I know it is possible to put JavaScript is a specific .js file and then include this in any page by just doing...
<script src="MyJavaScript.js"></script>
I note that with respect to these .js files that are included:
They do not actually have to end with .js
Their content should not be enclosed with tags
However, I need to import some JavaScript that is in a file ending with extension .page (I am using force.com platform) where th JavaScript is enclosed with the tags. The reason I need to do this is so I can write som unit tests using quint. Now, my hands are tied here. The cleanest way is to obviously refactor out the JavaScript from .page file into a .js file but I can't do this. I want to know is there any way I can just import the script snippets enclosed with tags.
Many thanks
As #totero said, you can specify the script type with the attribute
<script type="text/javascript" src="myFile.annoyingExtension">
But please, don't forget to close the tag otherwhise you will get strage bugs:
<script type="text/javascript" src="myFile.annoyingExtension"></script>
Close the tag itself wont work so please, don't do this
<script type="text/javascript" src="myFile.annoyingExtension" />
Is this what you are looking for?
<script type="text/javascript" src="MyJavaScript.page">
John Resig has a good approach to deprecate Tags. Might be worth a look.
There is also a SO thread on this Tag issue. Please see here.
You mention including Javascript, and by the looks of it, you're including them in a HTML document. Do you have any other programming or scripting language available to you that allows you to edit the document? If you can use something like PHP or ASP within the platform, you could have it read the .page file and echo it into your HTML output document (possibly stripping the <script> tags from it at your convenience).

Categories

Resources