JavaScript 학습 7 jquery 학습 1

jquery에서 $는 무엇입니까:

jQuery = window.jQuery = window.$ = function( selector, context )

상기 이 말을 통해 사실 jquery는 window의 한 속성이다
jquery에서 인터페이스 요소를 가져오는 방법(css 선택기):

     $("elementName") or id   $("#ID") or     $(".clsName")or      $("*")

물론 등급 선택기도 있다.

$("#id,.class,type")           $("#id .class type")        ，            

구체적으로 말해봐: 안 가져
,
구성 요소가 관계를 포함할 때 사용합니다. (한 div가 다른 div를 감싸고 있을 때, 물론입니다. 각 층을 포획하면 이벤트가 발생합니다.)
선택기는 다른 용도도 있습니다. 물론 원래의 방법으로class나 id를 정의하면 얻을 수 있습니다.
(1) div 아래의 요소 가져오기 사용 >:

$(".idd > .dd").text("    div    ，       p       $(\"   >    > ...\")     ？           $(\"div > p\")");

(2) 뒤따르는 원소 사용 가져오기
+:

$("div + p").text("     div p     ，      “+”        。         $(\"div + p\")");

(3) 뒤에 오는 모든 요소 가져오기
~

$("div ~ p").text("   div    ，       p          $(\"div ~ p\")");

이 밖에도 몇 가지 방법을 사용할 수 있다.
(1) 한 표가 첫 줄과 마지막 줄을 얻는다
html 코드:

 <table class="zuoye_1" border="1" width="400">
             <tr> 
                 <td></td> 
                 <td></td>
             </tr>
             <tr>
                 <td></td>
                 <td></td>
             </tr>
             <tr>
                 <td></td>
                 <td></td>
                 <td></td>
             </tr>
             <tr>
                 <td></td>
                 <td></td>
                 <td></td>
             </tr>
             <tr>
                 <td></td>
                 <td></td>
                 <td></td>
             </tr>
      </table>

js 코드:

$
(
    function()
	{
		$("#a").click
		(
		    function()
			{
				$(".zuoye_1 tr:first").children().text("     ");
			}
		 )
		$("#b").click
		(
		    function()
			{
				$(".zuoye_1 tr:last").children().text("      ");
			}
		 )
      }
)

짝수 행 선택:

$(".zuoye_1 tr:odd").children().text("     ");//odd    

홀수 행 선택:

$(".zuoye_1 tr:even").children().text("     ");//even    

특정 행을 지정합니다.

$(".zuoye_1 tr:eq(1)").children().text("     ");

범위 앞 x 행을 지정합니다.

 $(".zuoye_1 tr:lt(4)").children().text("   5 ");

마지막 행을 선택합니다.

 $(".zuoye_1 tr:gt(4)").children().text("   5 ");

h 태그의 내용을 변경합니다.

$(".h :header").text("  h    ");

태그 내의 텍스트 일치:

$("div:contains(KwooShung)").text(" KwooShung  jQuery");    div       （    ）

모든 태그에 포함되지 않은 텍스트를 일치시킵니다.

$("div:empty").text("           ");

일치가 비어 있지 않음:
$("div:parent").text ("요소나 텍스트 포함");
지정한 구성 요소를 포함하는 일치:

$("div:has(p)").text("   P  ");

어셈블리와 일치하는 숨겨진 요소:

<pre name="code" class="html">$("ul:hidden").show(500);

 与之相反，匹配所有可见的： 
  
  
 
$("ul:visiable").show(500);
  
모든 input에 id 속성을 포함하는 탭 +와 일치하는 역할은 다음과 같습니다.
$("input[id]").fadeIn(500);//500     
 모든 input 탭의value="xx"요소와 일치:
$("input[value='KwooShung'] + img").fadeIn(500);
 여러 조건의 조합 일치:
$("input[value!='KwooShung'][type!='radio'][type!='checkbox'] + img").fadeIn(500);
value 속성이 "xxx"로 시작하는 탭을 획득(정규에서:^는 시작을 표시하고 $는 끝을 표시함):
$("input[value^='Kwoo'] + img").fadeIn(500);
위에서 설명한 $:
$("input[value$='Kwoo'] + img").fadeIn(500);
 속성에 "xx"태그를 가져옵니다.
$("input[value*='Kwoo'] + img").fadeIn(500);
  
인터페이스의 요소를 획득한 후에 관련 조작을 할 수 있다(몇 개 열거).
$("Element").size()
$("Element").get()
$("Element").index($("Element"))
  
요소를 검색한 후 요소의 데이터를 가져오려면 다음과 같이 하십시오.
str=$("#input").val();   val（）     ，      ：.val("xxxxx")
  
지정된 요소의 여러 번째 가져오기
$("ul li:nth-child("+list[0]+")").css("background",list[1]);
 첫 번째:
$("ul li:first-child").attr("class","R");
 마지막 획득:
$("ul li:last-child").attr("class","R");
 그리고 유일한:
$("ul:only-child").css("background",black); 
jquery 확장:
$.extend
({
       max:function(num1,num2){return num1 > num2 ? num1:num2;},
       min:function(num1,num2){return num1 < num2? num1:num2;}
})
 호출할 때:
<script lang="javascript">
		var a=$.max(10,20);
		alert(a);	
</script>
 프로그래밍의 예:
$.fn.extend
({
         check:function()
         {
                 return this.each(function() { this.checked = true; });
         }

         uncheck:function()
         {
                 return this.each(function() { this.checked = false; });//this           
         }

})
  
이 방법도 플러그인의 실현 방법이다. 그 중에서this는 호출자가 현재dom를 가리키는 대상이다. 예를 들어 $("#abc") 이다.click (function () {this}) 여기의this는 #abc라는 dom 대상을 가리킨다.에이치가 위에서 설명했어.이 플러그인 방법 extend에서 두 가지 방법을 정의했습니다. 각각 check과 uncheck입니다.
$("input[@type=checkbox]").check () 는 input 탭의 type 속성을 선택한 것으로 설정하고, 중괄호의 내용은 input의 type 속성이 checkbox라면 선택한 것으로 설정합니다.