HighDots Forums  

a technique for dumping out debugging info for nodes in aJQuery select list. [bll_2009post]

jQuery jQuery is a fast, concise, JavaScript Library that simplifies how you traverse HTML documents, handle events, perform animations, and add Ajax interactions to your web pages. jQuery is designed to change the way that you write JavaScript.


Discuss a technique for dumping out debugging info for nodes in aJQuery select list. [bll_2009post] in the jQuery forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
buildlackey
 
Posts: n/a

Default a technique for dumping out debugging info for nodes in aJQuery select list. [bll_2009post] - 11-07-2009 , 09:18 PM






I've looked around on this list and in a number of books, but nothing
I read helped me figure out how to dump out the content of nodes in a
JQuery select list. I came up with my own technique, which uses good
old fashioned DOM functions to figure out a node’s name and
attributes. There is probably a better way, and I’d welcome
suggestions if you have them.

But for now, I’ll be using the DOM approach employed by the sample
code below.

In a nut-shell, this code uses a JQuery select expression to grab all
nodes that have an id attribute, whose selected attribute is “true”,
and whose name ends in “man”. We iterate through those nodes (actually
only one is found), and dump out its content using DOM functions.

<pre>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript"
src="http://jqueryui.com/latest/jquery-1.3.2.js"></script>

<script>
$(document).ready(function(){

var gatherAttributes = function(attributes) {
var attribs = ""
if (attributes) {
for (var i = 0; i < attributes.length; i++) {
attribs = attribs + "| "
+ attributes[i].nodeName + "=" +
attributes[i].nodeValue
}

}
return attribs

}

var dumpNode = function(node) {
alert("got a node: " + node.nodeName + " with attributes: " +
gatherAttributes(node.attributes) +
" / and inner content = " + $(node).html());
}

alert("HI");

$("input[selected=true][id][name$='man']").each (
function() {
alert("got a match " + $(this).val());
dumpNode(this);

});

});

</script>

</head>
<body>
<input id="man-news" name="man-news" > foo1</input>
<input name="milkman" > foo2</input>
<input id="fetterman" name="new-fetterman" > foo3</input>
<input selected="true" id="letterman" name="new-letterman" > foo3</
input>
<input name="newmilk" > foo4</input>
</body>
</html>


</pre>

any better way ? Please let me know.
Thanks !

Chris


This is a cross post from my blog @ http://buildchimp.com/wordpress/?p=165

_____

Chris Bedford

Founder & Lead Lackey
Build Lackey Labs
http://buildlackey.com

Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.