jQuery in Wordpress not working as expected in Chrome
I've been having this weird issue with jQuery which came with Wordpress 3.2.1. I'm developing a WordPress plugin. I'm using Chrome to do my debugging. I would normally turn on the developer tools to try out some jQuery function before putting them into the code. But for this particular combination, I have had problem with namely the ID selector and various HTML Object function.
jQuery('#id_of_html_element') //This will just return [] in the console
//If I put this in the plugin, it will run and show [object Object]
alert(jQuery('#id_of_html_element'));
//The following shows "null" but in fact I have html inside
alert(jQuery('#id_of_html_element').html());
//And this works as expected in the console
document.getElementById('id_of_html_element').innerHTML
I've tried disabling all extension on my Chrome, but the problem remains. On another page (e.g. Stackoverflow.com), jQuery works as expected in the console.
EDIT: Class selector does works properly in the console but html()
still returns null
EDIT: Sorry, it wa开发者_如何学JAVAs my mistake. I had a "-" in the id, which causes the problem. After replacing it with underscore, it works already. I notice it when it works on other wordpress plugin, but not mine.
If really want to access to html code inside element ID, try my solution:
var v1 = $('<div>').append($("#id_of_html_element").find("*").clone()).remove().html();
alert(v1);
I tested that on :
<div id="id_of_html_element">
<a href="#">Text</a>
<br/><a href="#">Another Text</a>
</div>
and the alert result was :
<a href="#">Text</a><br><a href="#">Another Text</a>
I tested that on FF, Chrome and that thing called IE, and everything seemed working well !
Don't ask me about white-spaces where they gone, its your problem now :P :P :P
Hopefully that helpful for you :)
精彩评论