We've been doing my little mail project and I've encountered some problems.
I've been using tomcat and apache so I use jsp right now.
My problem is that I cannot load js file with tag in jsp file.
We want to make kind of single page application so some jsp files are calling other jsp files.
Our jsp file structure is constructed like this way.
box.jsp -> mail-list.jsp -> (select mail from mail list, get mail
content to communicate with server, append at the bottom of the list
and swipe it with animation to show mail contents) -> detail-mail.jsp
In box.jsp, tags are working so I can load java scripts and use it because box.jsp(mail list viewer) shows mail list and all of our java script files are loaded at box.jsp.
But in detail-mail.jsp(show detail mail contents and etc), It doesn't work even though 'detail-mail.jsp' has tags.
Even though css files are loaded, java script files aren't.
Is there any way I can load java script file in this situation?
If I understand correctly: Are you trying to load script tags in an e-mail?
I'm not familiar with JSP, but I have done a fair bit of e-mail development.
You cannot use JavaScript in e-mails, unfortunately. So maybe the <script> tags are being removed from the output of detail-mail.jsp?
You should use these code if you want to load javascripts dynamically with append child.
const s = document.createElement('script');
s.type = 'text/javascript';
s.src = '/js/detail-mail.js';
$('head').append(s);
If you load html after javascripts, javascripts cannot figure out DOM ELEMENTS. So you should load HTML and after that, you shoudl load javascripts.
Related
I have a HTML file that I want to inject next to each result of a Google search result page from a Chrome extension.
I was wondering if I could use an iframe to load the HTML file?
This is instead of my current implementation that uses insertAdjacentHTML() in my Content Script and a horrible long string of HTML and inline CSS. Would much prefer to have a separate HTML file with its own CSS that I can just insert instead.
I tried:
chosenElements[i].insertAdjacentHTML('afterbegin', `<iframe src="/inject.html"></iframe>`);
but just get an iframe with a 404 page because it is looking in the 'https://www.google.com/index.html' directory rather than where the file sits.
The inject.html file is in the same place as the index.html file in my build folder for the extension. How do I access it? Can I access it?
Have you tried with
src="inject.html"
instead of
src="/inject.html"
I created a vanillaJS script that is used by several other websites. The script-server went down for a couple of minutes last week and the result was that several of the sites using the script were not loading correctly (slow, pages not loading at all, errors, etc.) because the sites kept on "waiting" for the external script to load.
I noticed ALL these sites had the script in de head. I suggested moving the script-tag to the footer plus adding the 'async' attribute. But is this the best solution?
Sidenotes:
Can't use jQuery
Can't use a framework like Angular or React
Preferably don't use additional JS on the site itself
The script created it's own content and does not rely on anything on
the page it's served on. It simply created a div with content from a
datababase staticly served in very basic JS to avoid cross-site
errors.
Thanks in advance.
async will make the script to load asynchronously and will be be executed while the page is reading.
defer will make the script to execute once the page is loaded although it's highly depends on the browser at to my tests IE9, IE8 supports this. You can make a quick check with this defer in fiddler
But there is one more alternative to have the script tag at the bottom as
<script>
window.onload = function() {
var element = document.createElement("script");
element.src = "vanillaJS .js";
document.body.appendChild(element);
};
</script>
But i guess these will not solve your problem where the script is not accessible cause of server fault. I suggest to have the local copy of the script in the website folder and reference it.
I want to write a npm package to localize an html url.
1. using the html url download the html page
2. parse the html file, extract all the js, css and img files used in the html and local these resources.
3. If these js, css and img files using some external resources, localize these resources. For example, extract background image in the css.
The first and second requirements are easy to meet. But I have no idea about the last one.
I can parse the all the css files and localize the resources used in it. But how can I parse the js files?
For example:
If the js adds a 'script src = XXX' tag into the html dom, how can I extract the src?
I think I would try to use a headless browser to catch every network calls instead of trying to parse the code.
I didn't used it personally but PhantomJS seems to fit the bill.
It can be used to load a webpage then execute any script / css that would normally happen on the request and execute stuff once the page is loaded.
The network monitoring features are probably what you'll want to use.
I need to be able to save a page on my website to my harddrive, so that i can use it both online and offline. The thing is, the page uses references to javascript and CSS files outside it's own folder. It is very important that i can save the whole page as one .html file, so that all the javascript and CSS code from the external files are in that file as well.
Is there a way to do this?
This should be programatically
As you request, this can be done programmatically with lets say Python.
The pattern of the code would look like this:
Request the user to paste the url in a box
wget or curl the page and use regex to find out where the included codes are
OR: use a library like SGML to interact with the HTML tags directly
Put all the linked CSS, JS etc. files in a List
Fetch all the linked files their contents and put them in a List
Rebuild the HTML source code and strip out the and tags stuff
Now loop the linked files's contents in the tags like this:
newHeaderContent = ''
for content in linkedFilesArray:
newHeaderContent = newHeaderContent + content
newHTML = firstHTMLCode + newHeaderContent + lastHTMLCode
I have two ASPX pages (P1.aspx and P2.aspx). The first (P1.aspx) contains a lot of JavaScript code.
How can I call all this JavaScript from another page (P2.aspx)?
I tried to do this using PageAsyncTask from code behind of P2.aspx, but JavaScript code (on P1.aspx) didn't work.
Any suggestions?
you cant do that.
put the javascript into JS file and reference it when needed.
What you can do ( I think) is to get the HTML content of the file and then EXTRACT the JS data
edit
try that (I dont think that it will include the inside JS - but try it yourself)
WebRequest oRequest;
WebResponse oResponse;
oRequest = WebRequest.Create("http://www.google.com/");
oResponse = oRequest.GetResponse();
StreamReader sr = new StreamReader(oResponse.GetResponseStream());
string pagedata = sr.ReadToEnd();
pagedata+=#"sdfsdf";
All javascript code you want to use on a page has to be included in that page or dynamically loaded by that page. You cannot call code that is only in another page.
The usual way of sharing code among pages is to have a .js file that contains common code that is included in more than one page and then a .js file that contains code that is unique to each specific page (if required).
One way to do this is <!--#INCLUDE FILE="somefile.aspx" --> but your aspx page will complain that there can be only one 'page' directive. So in order to do this properly you need to include as the previous mentiond the js files in the aspx file.
One way is makeing a master page and include all the necessary js code in there, then all pages that are loaded within the masterpage will automatically inherit the javascript included libraries.
Another way is to make an html file that includes all the libraries and then use the <!--#INCLUDE FILE="myjslibs.html" --> to include all your code there to each page.
So actually copy all your code in one file and then include that just one file each time in every page.