How to put script file in the head of view using EJS - javascript

I included layout to my view and also i need to make JS script to load for this view directly in the head. How to do that ?
// view file
<%- layout('/layout/boilerplate.ejs') %>
<script>
// want to load script in the HEAD of my boilerplate file.
</script>
I tried to add head tag and expected it to combined with head in boiler plate but didn`t. Do not want to add to boilerplate because it be downloaded for every route then.

There are a few steps that needs to be followed.
Put your JS files in the /public folder of your project.
Configure the Node server to serve your Static files.
Use a script tag to reference your JS in your ejs file
Hope this will be helpful.
Cheers!!

Related

I need help for connect js functions with ejs file

I wonder how I can insert JS functions into an EJS file?
I have this function:enter image description here
I tried to create a separate .ejs file where I will insert a function between the tags <% %> and also import it into the ЕЈS file that I need, but it doesn't work for me
EJS does not provide a DOM. Output from EJS is generated using <%= and similar.
The document object is only (that's a slight simplification) available in JS running in an HTML document in the browser.
To use that code you would need to include it in a <script> element output from the EJS into an HTML document and run in a browser.

How to load a script for a specific route in angular 4

I have to load a script that calculates the analytics on a specific route in angular 4. But for other routes the script should not get loaded.
I tried adding the script in index.html but the script will be loaded for all the routes. Any workaround for this?
below is the script
(function(a,b,c,d,e,f){
a.hj=a.hj||function(){(a.hj.q=a.hj.q||[]).push(arguments)};
a._hjSettings={hjid:xx,hjsv:xxx};
e=b.getElementsByTagName('head')[0];
f=b.createElement('script');f.async=1;
f.src=t+a._hjSettings.hjid+d+a._hjSettings.hjsv;
e.appendChild(f);
})(window,document,'https://xx.xx.com/c/xx-','.js?sv=');
If you add it in index.html then the script will be loaded in all components, and this is not your need. So you can try loading the script from the ts file of the component in which you want to load the script. So in the ts file, you can do it as follow.
System.import('https://xx.xx.com/c/xx-','.js?sv='); //or below one
require('https://xx.xx.com/c/xx-','.js?sv=');
Reference: https://stackoverflow.com/a/41402204/10971575

Update all href anchor links in folder of HTML files

I am using Gatsbyjs to generate a static site, this outputs a folder of static HTML files.
I have a requirement to host these HTML files on Microsoft SharePoint - this requires the .html to be converted to .aspx in order for them to run.
I have a postscript which updates all .html to .aspx (this works nicely).
However, all the generated links point to the folder:
link
In order for this to work on sharepoint, I need to update every href in each html file to point to the index.aspx file in each folder:
link
What's the best way to do on post build? Ideally, I'd like to include this as part of my post-build script. Can this be achieved with webpack? Or am I better off using something like JSDOM to loop through each file and update each of the links?
You are probably better off using cheerio, which is lighter than jsdom and supports most of the jquery syntax.
var html = fs.readFileSync(input.html);
const $ = cheerio.load(html);
var output = $('a[href="folder"').attr('href', '/folder/index.aspx').html();

how to load script file available in one folder up than the loading html file

I am kind of new to web development..so not sure if this is possible,
I am trying to load a script file from HTML file. Script file is available one folder up than the html
/test/myScript.js
/test/test123/MyPage.html
I am trying to load myscript.js file using following..but its not working. let me know how to proceed further on this.
<script src="../test/myScript.js" type="text/javascript"></script>
I have an emtpy web project from visual studio, this html file is added there. when i run the solution this file start on IISExpress
You need to remove test from the path.
Try this.
<script src="../myScript.js" type="text/javascript"></script>
Make sure script file is also added to visual studio project.
HINT : You can also drag script file to the HTML editor in visual studio. It would have created script tag with path for you. Not sure which visual studio you are using but almost all VS support this.

.Net MVC 3 Adding Javascript

I am sure there is a very simple answer to this question, I think am just having trouble. I have animation.js file. It also has a include folder with dependency_1.js and dependency_2.js. In my animation.js file I do load dependency_1.js and dependency_2.js relative to my animation.js file.
In my _Layout.cshtml file I do have:
#RenderSection("JavaScript", required: false)
And I did place within my view SomeView.cshtml
#section JavaScript
{
<script type="text/javascript" src="#Url.Content("~/Scripts/animation.js")"</script> }
But when my animate.js file calls the dependency_1.js file I get a 404 Not Found - http://localhost:14611/includes/dependency_1.js"
Im guessing it has to do with the url routing to the Scripts folder in my MVC project?
Relative paths in Javascript files are relative to the HTML page, not the source Javascript.
You need to use an absolute path.

Categories

Resources