收录日期:2019/12/07 11:52:46 时间:2010-10-28 14:14:40 标签:jquery,css-selectors,custom-attributes

I'd like to select elements with attribute names (keys) that begin with a set string. Use case: the jQuery UI dialog creates buttons whose only unique identifers are a pseudo-random custom attribute with a sequential value such as jQuery1288273859637="40"

I'd like to select based on the fact that the attribute's name is jQuery* (begins with jQuery)

The attribute you are looking at is the jQuery expando ... it would be completely useless to target these attributes as the number after the "jQuery" is based on the current time and changes with each page reload (ref1 & ref2).

It would be best to target a class in your base HTML. For example, the jQuery UI Dialog should have this base HTML (ref):

<div class="ui-dialog ui-widget ui-widget-content ui-corner-all ui-draggable ui-resizable">
   <div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix">
      <span id="ui-dialog-title-dialog" class="ui-dialog-title">Dialog title</span>
      <a class="ui-dialog-titlebar-close ui-corner-all" href="#"><span class="ui-icon ui-icon-closethick">close</span></a>
   </div>
   <div style="height: 200px; min-height: 109px; width: auto;" class="ui-dialog-content ui-widget-content" id="dialog">
      <p>Dialog content goes here.</p>
   </div>
</div>

Find the id or class you want to target and use it instead!

If you need to target a button in the dialog, then use something like this:

$('.ui-dialog .ui-button:contains("Cancel")')

Only think I could think of would be to test the individual keys of every DOM element in a .filter().

This would be horribly inefficient, but if you really wanted it, it could look something like this:

$('body *').filter(function() {
    for( var k in this ) {
        if( this.hasOwnProperty(k) && k.indexOf( "jQuery" ) === 0 ) {
            return true;
        }
    }
    return false;
});

This will loop over all elements in the <body>, and then loop over the key/value properties of each, testing each key to see if it starts with "jQuery". If so, it returns true, and the loop is broken. If not, it returns false after all properties have been tested.

I'd find another way. Seriously, don't do this.

Get an reference to the dialog, and then use a css selector to find the button. firebug (or google chrome developer tools) are useful for determining what to look for.