We Keep Coding

Removing HTML element in iframe with JavaScript

I'm attempting to remove an image from an embedded iframe (inline iframe). While it works sometimes, sometimes it failes with an error. I am running this code on Chrome. This behaviour is strange. I have tried this on a few sites and I am unable to find any reason for this.
I would like to know why it fails sometimes and does not sometimes with all parameters the same (I'm simply executing this in the console). Secondly, if possible is there an alternative solution?
$("#content_ifr").contents().find("img").remove();
Error message that occurs sometimes:
Uncaught TypeError: Cannot read property 'contents' of null
If it helps, I'm attempting to remove images and extra content from the WordPress page editor (Classic) using JavaScript.

Being that you said it sometimes works and sometimes it doesn't. When it works, check the Javascript context. I was running into issues where my code worked with DevTools opened, but if I refreshed the page, the javascript context would revert to "Top", and I needed to be in that frame.
[

Turns out that my Chrome extension was interfering with this. We were attempting to run this script using a Chrome extension on a WordPress site.
Changing these lines to this worked:
jQuery("#content_ifr").contents().find("img").remove();
As #Jason Owens pointed out, the context was for some reason switching. I noticed that using 'jQuery' instead of $ seemed to work. I think this was because the Chrome extension was using standard jQuery as a dependency. However, '$' didn't work WordPress avoids the '$' symbol using noConflict and uses 'jQuery' instead.

We can't remove elements from Iframe but we can hide
Try This:
$(document).ready(function(){
$('#content_ifr').contents().find('img').hide();
});

What would make HTML/JS/PHP source suddenly end/stop while loading?

I've been building a set of mostly HTML and JS functions using Jquery and ajax with PHP backend. For some reason, a page that didn't used to have problems suddenly doesn't load. When I check the document inspector, I find that the code just... stops. Before it ended on a line of HTML. Today, it's in the middle of some JS code (around line 1364).
I had a chunk of JS code commented out that I removed from the code and suddenly it worked... until I brought in some more code from another file and it suddenly stopped again.
What makes HTML code suddenly stop? It's driving me nuts! My code became very fragile.

Check these ：
1.does JavaScript has syntax error? (check inspector console)
2.does your PHP has syntax or logic error?(Ex:In CentOS 7,type command#tail -f /var/log/httpd/error_log)
Trouble Shoot
Sometime js do not report error even the program stop.
So, you can add some console.log('test') in your code to find out which line cause js exec stop.

I had to remove most of my code and reinsert it one section at a time. I found a missing tag though I still don't understand why the code responded in such a weird way.

Is there an easy way to know what line of jQuery script called an event?

I'm working on a drupal module (irrelevant) and I'd like to recreate a javascript/jQuery event. If I use chrome and go to event listeners I see the jQuery script is called on line 57, however this doesn't really help as:
The script is minified and unreadable
I'd like to know what line of
the jQuery using scripts called the event (what selector and what
body of it's function), not the jQuery script itself
It's not easy to find the file by just
searching for fit selectors as there are 100's of loaded javascripts
files thanks to drupal and it's installed modules.
The reason is that I'd like to recreate this (ajax probably) call:
So does anyone know of a trick like a chrome plugin or something? It could shave a lot of time for me.

If you are setting a correct breakpoint then you should be getting a Call Stack on the Source Tab, on the right hand side. There you should be able to track down the file which initiated the call.
And as they say, a picture speaks a thousand words..
And to further elaborate on your question,
It is always advisable to use an uncompressed jQuery.js (Or for that matter any .js) during the development, as you might have already figured out.
Steps for someone new.
Inside the compressed file just get the version no.
Download the respective uncompressed version of the jquery from the official website.
If you don't want to change the code just rename the uncompressed file to jQuery.min.js or whatever is currently being loaded, so It will work as a drop in replacement.

Try chrome devtools, for example:
Sources -> Event Listener Breakpoints (to the right) -> Mouse -> click

Using Javascript to sort table properly?

I've been working on this website on my computer for the past several weeks, but have had it a point that I just can't figure something out with my table sorting. The site itself runs off PHP but I've duplicated the HTML output to make it easier for you guys to help me diagnose what the problem is.
Here's a link to the Working Page: http://privateservercloud.com/working.htm
Here's a link to the Not Working Page: http://privateservercloud.com/not-working.htm
If you go to the Working Page, you'll see that you can click on any of the headers of the table and it will sort them. However, if you go to the Not Working Page, you'll see that this doesn't happen.
I'm trying to figure out what's missing or coded incorrectly and causing this to happen. I've uploaded all of the HTML, CSS, and Javascript that's running this part of the site so you can see how it's all working and hopefully that'll make life a bit easier for anyone that can help.
So... does anyone see what I'm doing wrong or know what needs to be fixed?

I load the not-working example in Firefox with Firebug and get the following:
TypeError: document.getElementById(...) is null
...for(var e=0;e<menuids.length;e++){var t=document.getElementById(menuids[e]).getE...
in dropdown.js line 1.
The debugging tools really are your friends. If you don't want to use Firefox, you can do the same thing with the development tools in Chrome.
I find errors when I run rhe validator at http://validator.w3.org and a pile of CSS errors at http://jigsaw.w3.org/css-validator/
When things don't work right, validate the HTML, which at least mostly assures you have a valid DOM. Then validate the CSS and use the JavaScript console in your favorite browser's debugger.

How do I see error messages for JavaScript/JQuery code in IE?

I am new to javascript and have been working overnight to see how I can fix this error on IE: Here's the question I asked here yesterday: How to fix this jquery function to work in IE?
After spending more than 20 hours I still can't find out why it wouldn't render parts of my page properly.
At the very least I thought I could find a way to get the errors so I can fix them or do a separate javascript file just for IE, but no luck.
How do I see error messages for my script?
I used F12 to see the developer console but no help there, it won't even tell me what's wrong.
I am using IE 8 and 9.
I know that there could be many things wrong with this and I appreciate your patience in advance for helping me out. Thanks!

You have invalid HTML including many invisible characters within the head section which is also blocking the W3C HTML Validator from getting past the first few errors.
When I copied your source code into my text editor, I found a bunch of invalid invisible characters. Did you cut/paste your JavaScript from someplace like a web-page? The invisibles only appear in front of your custom written scripts in the <head> and nowhere else. This could certainly explain a lot, including the validation error about a misplaced </head> tag. Go back to your editor and delete the indentations on every single line within the entire <head></head> section, then re-indent each line from scratch.
I also see an invalid closing tag, </label6>.
Remove the invisible characters, fix the invalid HTML, and see what IE does.
Moving forward, get yourself a powerful text editor that will allow you to see invisible characters so you can delete them and properly indent as needed. Otherwise, I recommend re-typing your code rather than cutting & pasting.

For JavaScript errors, the best is to see the 'Console' tab for records.
If IE's one isn't showing anything, maybe you could try using FireBug Lite, adding the following script after <head> (YES, put it as first thing, so it loads first than anything else).
<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>
On side note, maybe isn't a JS problem and yes something about running code locally. IE has some policies that mostly block client-side code from running. (Remember those annoying ActiveX prompts?). Check Intranet configuration on Settings.