2013年8月3日 星期六

jquery-selector

http://www.tutorialspoint.com/jquery/jquery-selectors.htm

$(window).load(function(){
});

$("div").addClass("special")
jQuery("div").addClass("special")


$('li:eq(0)')
$('li:even')
$('li:li(3)')
$('li:not(.goofy)')
$('p a[href*=#]')  <a href="#dt-link3_same-page_link" title="">
$('code,li.goofy') <code>something</code> <li class="goofy">something</class>
$('ol.goofy>strong')
$('li+li>a[href$=pdf]')
$('span:hiddn')
$('')

$("#body")

$("div #body")

$("div .contents p")

$("div > div") // first level

$("div:has(div)")
$("p:odd")
$("p:even")
$("p:first")
$("p:last")
$("p:first-child") 
$("p:last-child")
$("p:only-child") 
$("p:nth-child(n)")
$("p:nth-child(odd|even)") 
$("p:nth-child(nX+Y)") e.g. $("p:nth-child(n5+1)") = 1,6,11,16 ...
$("p:eq(n)") // count number of before
$("p:gt(n)") // count number of after
$("p:lt(n)")  // count number of before of full page

$("form input:checkbox : checked")
$("form input:animated") 
$("form input:button") 
$("form input:contains(foo)")
$("form input:disabled")
$("form input:enabled")
$("form input:file")
$("form input:header") $("form input:hidden") 
$("form input:image") 
$("form input:input") 
$("form input:not (filter)") 
$("form input:parent") 
$("form input:password") 
$("form input:radio") 
$("form input:reset") 
$("form input:selected") 
$("form input:submit") 
$("form input:text") 
$("form input:visible") 


$ ("td:nth-child(1)")  /*first Row */

$("a[target]").append("(Opens in New Window)");
$("a[href$=pdf]")

$("div").not(".green, #blueone").addClass("myClass");
$("div").addClass("myClass1").filter("[class*=middle]").addClass("myClass2");

$("#body").CSS({
border: "1 px solid green",
height:"40px"
})

$('#abc_frame').prop('src', 'NewFile.jsp')

$('.filePrew').change(function(){
    $('.browseText').val($(this).val());
});

$('a').css('cursor', 'pointer');
$('.filePrew').css('cursor', 'pointer');


$(function(){
    $("div").addClass("myClass1").filter(function(index){
        return index == 1 || $(this).attr("id") == "fourth";
    }).addClass("myClass2");
});


$(function(){ $("p").find("span").addClass("myClass");});
$(function(){$("p").find("span").addClass("myClass1").end().addClass("myClass2");});
$(function(){ $("div").find("p").addClass("myBackground").andSelf().addClass("myBorder");});



  • $('*'): This selector selects all elements in the document.
  • $("p > *"): This selector selects all elements that are children of a paragraph element.
  • $("#specialID"): This selector function gets the element with id="specialID".
  • $(".specialClass"): This selector gets all the elements that have the class of specialClass.
  • $("li:not(.myclass)"): Selects all elements matched by <li> that do not have class="myclass".
  • $("a#specialID.specialClass"): This selector matches links with an id of specialID and a class of specialClass.
  • $("p a.specialClass"): This selector matches links with a class of specialClass declared within <p> elements.
  • $("ul li:first"): This selector gets only the first <li> element of the <ul>.
  • $("#container p"): Selects all elements matched by <p> that are descendants of an element that has an id of container.
  • $("li > ul"): Selects all elements matched by <ul> that are children of an element matched by <li>
  • $("strong + em"): Selects all elements matched by <em> that immediately follow a sibling element matched by <strong>.
  • $("p ~ ul"): Selects all elements matched by <ul> that follow a sibling element matched by <p>.
  • $("code, em, strong"): Selects all elements matched by <code> or <em> or <strong>.
  • $("p strong, .myclass"): Selects all elements matched by <strong> that are descendants of an element matched by <p> as well as all elements that have a class of myclass.
  • $(":empty"): Selects all elements that have no children.
  • $("p:empty"): Selects all elements matched by <p> that have no children.
  • $("div[p]"): Selects all elements matched by <div> that contain an element matched by <p>.
  • $("p[.myclass]"): Selects all elements matched by <p> that contain an element with a class of myclass.
  • $("a[@rel]"): Selects all elements matched by <a> that have a rel attribute.
  • $("input[@name=myname]"): Selects all elements matched by <input> that have a name value exactly equal to myname.
  • $("input[@name^=myname]"): Selects all elements matched by <input> that have a name value beginning with myname.
  • $("a[@rel$=self]"): Selects all elements matched by <p> that have a class value ending with bar
  • $("a[@href*=domain.com]"): Selects all elements matched by <a> that have an href value containing domain.com.
    function enableSubmit(id) {
        $('input[id$="submit' + id + '"]').attr('disabled', false); 
    }

  • $("li:even"): Selects all elements matched by <li> that have an even index value.
  • $("tr:odd"): Selects all elements matched by <tr> that have an odd index value.
  • $("li:first"): Selects the first <li> element.
  • $("li:last"): Selects the last <li> element.
  • $("li:visible"): Selects all elements matched by <li> that are visible.
  • $("li:hidden"): Selects all elements matched by <li> that are hidden.
  • $(":radio"): Selects all radio buttons in the form.
  • $(":checked"): Selects all checked boxex in the form.
  • $(":input"): Selects only form elements (input, select, textarea, button).
  • $(":text"): Selects only text elements (input[type=text]).
  • $("li:eq(2)"): Selects the third <li> element
  • $("li:eq(4)"): Selects the fifth <li> element
  • $("li:lt(2)"): Selects all elements matched by <li> element before the third one; in other words, the first two <li> elements.
  • $("p:lt(3)"): selects all elements matched by <p> elements before the fourth one; in other words the first three <p> elements.
  • $("li:gt(1)"): Selects all elements matched by <li> after the second one.
  • $("p:gt(2)"): Selects all elements matched by <p> after the third one.
  • $("div/p"): Selects all elements matched by <p> that are children of an element matched by <div>.
  • $("div//code"): Selects all elements matched by <code>that are descendants of an element matched by <div>.
  • $("//p//a"): Selects all elements matched by <a> that are descendants of an element matched by <p>
  • $("li:first-child"): Selects all elements matched by <li> that are the first child of their parent.
  • $("li:last-child"): Selects all elements matched by <li> that are the last child of their parent.
  • $(":parent"): Selects all elements that are the parent of another element, including text.
  • $("li:contains(second)"): Selects all elements matched by <li> that contain the text second.



沒有留言:

張貼留言