Jquery: How do I query from a given html element?

satya - Wed Oct 10 2012 11:40:22 GMT-0400 (Eastern Daylight Time)

looks like one can use find


var x = $("#divid")[0];
$(x).find("data"); //look for an element

satya - Wed Oct 10 2012 11:40:48 GMT-0400 (Eastern Daylight Time)

jquery find seem to disturb inner html!

jquery find seem to disturb inner html!

Search for: jquery find seem to disturb inner html!

satya - Wed Oct 10 2012 12:04:02 GMT-0400 (Eastern Daylight Time)

Or may be ie is the culprit!

Or may be ie is the culprit!

satya - Wed Oct 10 2012 12:06:24 GMT-0400 (Eastern Daylight Time)

This works in chrome but not ie


function akcExpand_folderWidget_function(divObject)
{
    alert("ok i got called");
    var x = $(divObject).find("folder_id")[0];
    alert(x.childNodes.length);
    alert(x.nodeName);
    alert($(x).html());
}

satya - Wed Oct 10 2012 12:06:43 GMT-0400 (Eastern Daylight Time)

The div is


<div class="akc_expand" type="folderWidget">
    <data x="10">
        <folder_id x="15">231</folder_id>
    </data>
    <div class="akc_expand_result">
    </div>
</div>

satya - Wed Oct 10 2012 12:07:43 GMT-0400 (Eastern Daylight Time)

In ie the innerhtml has gone 'ghaayab!' (Disappear)

In ie the innerhtml has gone 'ghaayab!' (Disappear)

satya - Wed Oct 10 2012 12:10:22 GMT-0400 (Eastern Daylight Time)

How to create a DOM from string in javascript?

How to create a DOM from string in javascript?

Search for: How to create a DOM from string in javascript?

satya - Wed Oct 10 2012 13:35:33 GMT-0400 (Eastern Daylight Time)

how to create XML DOM using ie from a string in javascript?

how to create XML DOM using ie from a string in javascript?

Search for: how to create XML DOM using ie from a string in javascript?

satya - Wed Oct 10 2012 13:37:50 GMT-0400 (Eastern Daylight Time)

jquery DOMPareser ie XML

jquery DOMPareser ie XML

Search for: jquery DOMPareser ie XML

satya - Wed Oct 10 2012 16:07:28 GMT-0400 (Eastern Daylight Time)

See if this blog about jquery parsexml method helps

See if this blog about jquery parsexml method helps

Search for: See if this blog about jquery parsexml method helps

satya - Wed Oct 10 2012 16:07:37 GMT-0400 (Eastern Daylight Time)

jquery parsexml usage

jquery parsexml usage

Search for: jquery parsexml usage

satya - Wed Oct 10 2012 16:08:16 GMT-0400 (Eastern Daylight Time)

Here is jquery's document on parsexml

Here is jquery's document on parsexml

satya - Wed Oct 10 2012 16:25:03 GMT-0400 (Eastern Daylight Time)

jquery parsexml throwing an exception

jquery parsexml throwing an exception

Search for: jquery parsexml throwing an exception

satya - Wed Oct 10 2012 16:57:07 GMT-0400 (Eastern Daylight Time)

ie eating away removing quotes in innerhtml

ie eating away removing quotes in innerhtml

Search for: ie eating away removing quotes in innerhtml

satya - Wed Oct 10 2012 17:02:44 GMT-0400 (Eastern Daylight Time)

Lo, it is true. Here is SOF

Lo, it is true. Here is SOF

satya - Wed Oct 10 2012 21:22:53 GMT-0400 (Eastern Daylight Time)

Key lessons


A jquery selector returns an array of DOM elements
It is always an array of DOM elements
so you have to access element 0
this element is a base DOM and not a jquery object
you have to wrap it with a $ if you want to further search
The find will also return an array of DOM elements
ie has a problem obtaining inner html for some of these elements
you can use $.parseXML to parse arbitrary xml data
However if the input to this process is an inner html
   then ie has problems
ie seem to remove the quotes from the attributes of inner html
which means this inner html will not get parsed as 
   the attributes are without quotes which is not valid xml
There are suggestions to use tools like "tiny html"
   to format the inner html to requote them
If your html doesnt start out as an inner html you are ok

satya - Wed Oct 10 2012 21:29:05 GMT-0400 (Eastern Daylight Time)

Also consider the following segment


<div class="akc_expand" type="folderWidget">
    <data>
        <folder_id>231</folder_id>
    </data>
</div>

satya - Wed Oct 10 2012 21:30:43 GMT-0400 (Eastern Daylight Time)

Now consider this code where the 'div' is pointing to the parent div above


function akcExpand_folderWidget_function(divObject)
{
    alert("ok i got called");
    var y = $(divObject).find("data")[0];
    alert($(y).html());
}

This code will not work in ie but will in chrome. So there is something odd ie is doing here.

satya - Wed Oct 10 2012 21:33:27 GMT-0400 (Eastern Daylight Time)

However the same code works if my children are truly html elements


<div class="akc_expand" type="folderWidget">
   <div>
        <p class="x">ddddd</p>
   </div>
</div>

it appears ie ignores the non-html tags and doesn't know how to reconstruct!