There is a site with wall of topics. Anyone can write anything. But anyone can write JS script and this script will be executed with loading this site.
Something like document.body.innerHTML = "";.
I wrote also script which found every script in <div> with topics and rewrite its to empty string, but it does not work.
If I tested this script on the site (in console) with topics (before executed), it found scripts and rewrite its, but after post my script to this website, it does not work. Scripts will be executed after all.
Can I fix it before help from IT tech?
One solution is to add the user content as a text node. The content will show up exactly as the user typed it. Though if you're trying to include formatting (bold, italic, etc.), this won't work.
const userContent = "<myScript>alert('here')</myScript>"
const userContentNode = document.createTextNode(userContent)
document.body.appendChild(userContentNode)
<body>
</body>
I had to use <myScript> instead of <script> because it looks like Stackoverflow does some kind of anti-XSS stuff for snippets.
Related
This question have been already treated on the internet but i dont find a simple answer.
I would like to load only thoses javascript files and css, before starting to run the body my website.
I'm using packery.js, but when my website appears at first, my divs are misplaced. When i reload the page, everything gets back in place.
Is there a way to say : does all css and js files have been donwload? Yes? Ok run the body.
Thank you
There isn't a lot of information you provided which would help us solve the issue directly, however couple of things...
Make sure all your scripts and styles links are places in the head tags. The HTML page gets rendered in browser Top-Down. I.E. It'll load any files from HEAD tags before the body is reached, same thing if you want your scripts to be loaded after the body is loaded.. just put them at the bottom, before the BODY closing tag.
Using JQuery would be the fastest solution if you wanted to perform some functionality after your page has loaded (I know there isn't a JQuery tag, however thought providing a JQuery answer could be advantageous.
$(document).ready(function()
{
//Document Loaded, Put code you want to execute here.
}
I am adding an html file to my GWT page like so:
HTML htmlPanel = new HTML();
String html = MyHtml.INSTANCE.getHtml().getText();
htmlPanel.setHTML(html);
RootPanel.get().add(htmlPanel);
and that works ... but the embedded script files don't run. I see the line in Chrome's Elements tab where the script should be loaded, but apparently it is not (doesn't show up in the Scripts tab, and debugger lines are not hit).
As a test, I loaded the html file straight into my browser (not via GWT), and the script does show up in the Scripts tab and it does run the code (so it's not an issue with the script tag itself).
So ... why/how do the scripts not run when embedded by GWT? (I wouldn't know how to keep an embedded script from running if I tried!) ;o)
Do I have to use the ScriptInjector to make this work (I'm having my own problems with getting that working, which is a subject for another thread)? If so ... why?
Thanks for your help!
Creating the script by adding it to an HTML widget and appending it to the page will not work, this is not supported by the browser. GWT isn't doing this, the browser is, or rather, the browser is doing it because of how the HTML widget works. For specifics on why this is the case, see the great answer at https://stackoverflow.com/a/13392818/860630 that digs into the details.
There are several other ways you can do this, but they all boil down to the work that the ScriptInjector is already doing - if ScriptInjector doesn't work for you, it seems unlikely that the other options will behave either. Maybe edit your question to use ScriptInjector and describe your issues, or ask a new question with it? The only cases where I've seen ScriptInjector not work is related to $wnd, or which page the script is appended to (see com.google.gwt.core.client.ScriptInjector#TOP_WINDOW).
I have a 3rd party script that displays some data on my site. When the script loads it breaks all of the JS on any page the script is in. I remove the script and my page works without issue.
Are there ways to prevent 3rd party scripts from interacting with my page in a way the breaks the page?
Notes:
I have no access to the 3rd party script to edit.
I am using jQuery for the scripts that are breaking. I have in place jQuery.noConflict yet it still breaks the page.
I have attempted to load the script in an iframe to see if that made a difference. It did not.
The script does write data to the page, mainly CSS and HTML
Note: The below code may contain references/links to drug content, mainly marijuana.
I am building a site for a medical marijuana dispensary. I am importing the menu of the dispensary from a site called WeedMaps. Their embed code looks like this:
<script type="text/javascript">var wmenu_id = 1111;</script> //The number correlates to the menu I need to pull, I have changed it in this question
<script type="text/javascript" src="http://legalmarijuanadispensary.com/components/com_weedmenu/weedmenu-widget.js"></script>
When I use the above code the JS of my site breaks. How to I prevent my code from breaking when using 3rd party scripts over which I have no control.
UPDATE
Here is a JS Fiddle. The menu opens but doesn't close properly. Remove the script that is generating the menu from weedmaps and the menu works correctly. (The weedmaps menu script is in the bottom of the HTML panel.)
Hmm, not having much luck. I'll add what I have, since it may trigger further ideas from you. However, in short, I think their script isn't written particularly well, and that they really do need to fix it on their end.
As it stands, Firefox shows this error when animating the menus:
TypeError: jQuery.easing[jQuery.easing.def] is not a function
This blog suggests that this occurs when the Easing plugin is loaded before jQuery. Fine, I thought - we just need to load the WeedMenu script after our jQuery has loaded. So I tried the following (with help from here):
$j.getScript('http://legalmarijuanadispensary.com/components/com_weedmenu/weedmenu-widget.js');
That gave me this error:
A call to document.write() from an asynchronously-loaded external script was ignored.
Turns out that occurs as a result of the WM script using document.write, which is desperately out of date. So that lead me on to find crapLoader, which is meant to handle this sort of thing:
crapLoader.loadScript("http://legalmarijuanadispensary.com/components/com_weedmenu/weedmenu-widget.js", "menu-script");
Unfortunately that brings me back to the original Easing error.
Here's my fork - let me know if you find anything!
The script is not well written, I was able to solve my issue by removing a line of code from the script. The link I provided list to a longer script. The script had this line of code:
try {
b("http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"), "function" != typeof wmenu_strains_callback && b("http://legalmarijuanadispensary.com/components/com_weedmenu/weedmenu.js", !0)
}
if I remove b("http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"), then the script works and my page works. What was happening was the script was inserting jQuery into the bottom of my head and breaking the rest of my javascript.
I have a web page that loads an external chat script, but the script loads before all my CSS and jQuery kick in, so my page looks all messed up for a few seconds. Need help figuring out how to launch my chat script once the page is done loading...I think it can be done by adding the script into my jQuery setup, but I'm not sure how to do that.
here's the code, it's self-explanatory enough not to be familiar with the actual software.
<script>
var online_text = "Chat Online Now";
var offline_text = "Chat Not Available";
var check_back = 1; // this lets the script check the operator status without being logged in
</script>
<script src="http://my.domain/chat/file.php"></script>
I think what happens is that the .php file will write my online or offline text with the necessary chat link, and that's why I have to put the script in the place where I want the chat text to display.
hope that makes sense...and hopefully the community can help me figure out how to solve the problem. thanks!
UPDATE: here's where I am so far, unfortunately the #chaticon element is empty, even if I replace the script with simple text. Using jQuery 1.4.2 by the way:
$(document).load(function() {
var online_text = 'Chat Online Now';
var offline_text = 'Chat Not Available';
var check_back = '1';
$("li#chaticon").html('<script type="text\/javascript" src="http:\/\/my.domain\/chat\/file.php"><\/script>');
});
Check out using the JQuery function $(document).ready().
It will hold off running until your entire document is loaded and ready to go.
$(document).ready(), which was previously mentioned, will only wait until the DOM is ready for manipulation (i.e., the node hierarchy has been fully constructed). This will not, however, wait until any additional resources (images, style sheets, etc.) have been loaded, which sounds like what you're wanting to do.
If you need all of these additional resources to be loaded first, then use $(document).load(). This will wait until all additional resources have finished loading (and hence the page will have been fully rendered).
Stephen,
As per Dave's advice of putting the $(document).ready() function on the page i.e:
$(document).ready(function() {
var online_text = "Chat Online Now";
var offline_text = "Chat Not Available";
var check_back = 1;
// do any other stuff here
});
also, make sure the js files are loaded at the bottom of the page, just ahead of the closing </body> tag and the css is loaded in the <head> tag. This may or may not sort the above issue, but is recognised as 'good practice' in terms of page configuration.
jim
thanks jmar777, I agree there's some re-evaluating that needs to be done here...the chat script is a mix of document.write, php/mysql and some dom-oriented stuff. Not worth toying with for hours.
So I ended up putting the code from my original post into a PHP function and returning it to a variable all the way at the top of the page, this way it would be written a little bit earlier than if it were written on the fly while my page were loading. And I made a few tiny tweaks to my CSS file so that the part of the page that was getting strange-looking while the chat script loaded wouldn't look as strange.
I have searched this web looking for an answer, but it seems that this time I'm not so lucky, so I am forced to ask. I apologize if it's already answered (could not find it). And yes, English is not my first language, so I also apologize for my spelling mistakes, I try my best.
This is my problem, using Tomcat 5.5, Struts 1.3, JRE 1.5 and I'm using firefox 3.5.6.
In my jsp page I cannot seem to put any src="path/path" in my <script> I have tried deleting the src and all works well, but my project is going to need a lot of use from jquery and I do not want to copy/paste all the js file in every jsp.
This is my code:
<script type="text/javascript" src="js/jquery-1.3.2.js">
function showMySelf(){
alert("Hello World!");
}
(... plus other stuff code that actually uses jquery functions)
</script>
and the submit button:
<input type="submit" onclick="showMySelf()">
When I click the button, nothing happens (well it actually repaints the page) and when I delete the "src" tag from the script and add all the jquery code to the page it all works well.
I have tried putting another slash in the path as "/js/jquery-1.3.2.js" and returns an error.
I have tried using ResolveURL and it doesn't seem to give me better results.
I have also tried changing the js file to another file ("generics.js" and "js.js"), I also tried with "js/*.js".
Any of theese solutions have archived anything.
I have also tried using the struts tags (like html:submit) but it also did not work.
The path is actually right, since looking the code in my web browser gives me a link to the js file. So I suposse the browser knows were to look for my js file, it does not give me an error or a broken link to the file.
Any ideas of why this is happening?
Thank you all.
Random.
You can not use a script element to load an external file and put code in it at the same time. You need to use two script elements:
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
function showMySelf(){
alert("Hello World!");
}
(... plus other stuff code that actually uses jquery functions)
</script>
I think Gumbo solved it.
As a sidenote, a very good way to find out whether a browser can load a JS file is the "Net tab" in Firebug in Firefox. It shows all loaded (and failed) requests of the current page.
The two most likely options are:
a) You are including HTML in your JS file (i.e. <script> tags)
Take it out.
b) You have the wrong URI and when you attempt to resolve your relative URI manually you do so incorrectly
Look at your server access logs to see what is actually being requested (or use a tool such as Firebug)
The first thing to do in such case. Install Firebug and look at the "Console" panel (for possible syntax errors) and the "Net" panel to see whether your jQuery sources are being fetched correctly. The 2nd column there shows the request status code.
alt text http://img46.imageshack.us/img46/6224/jqueryfirebugtmp.jpg
(full size image)