Multiple Attribute [attr="value"][attrn="valuen"] JQ Home  <<  Selectors  <<  Multiple Attribute [attr="value"][attrn="valuen"]

• <<    Has Attribute Selector
• All Selector ('*')     >>

Multiple attribute match selector.

Shorthand version $('[attr="value"][attrn="valuen"]')

Description

The [attr="value"][attrn="valuen"] selector, selects all elements that match all of the specified attribute and value filters

Syntax

Parameters

Return

N/A.

Multiple Attribute [attr="value"][attrn="valuen"] Examples Selectors  <<  Top

Selects all elements that match all of the specified attribute and value filters.

The following example will select 'a' elements with a 'href' attribute of '#multiattrb' that contain a 'span' element with a class of 'ital' and turn the background colour yellow.

$(function(){
  $('#btn1').on('click', function() {
    $('a[href="#multiattrb"] span[class="ital"]')
      .css('backgroundColor', 'yellow');
  });
});
 

The following example will select left sidebar elements ' that contain a 'link' element with a 'href' attribute that starts with 's' and turn the background colour silver.

$(function(){
  $('#btn2').on('click', function() {
    $('div[class="sidebarleft"] a[href^="s"]')
      .css('backgroundColor', 'silver');
  });
});
 

The following example will select 'ul' elements with an id of 'fb' that contain a 'link' element with a 'href' attribute that starts with 'last' and turn the background colour orange.

$(function(){
  $('#btn3').on('click', function() {
    $('ul[id="fb"] a[href^="attrib"]')
      .css('backgroundColor', 'orange');
  });
});
 

Related Tutorials

jQuery Basic Tutorials - Lesson 4 - jQuery Selectors

• <<    Has Attribute Selector
• All Selector ('*')     >>