날카로운 jquery
30129 단어 jQuery
홈페이지에서 jquery를 다운로드하세요.js 파일, 그리고 페이지에 도입: 탭에 jQuery 라이브러리를 도입합니다.
"jquery.js"</span> type=<span class="hljs-string">"test/javascript"</span>><span class="xml"><span class="hljs-tag"></<span class="hljs-title">script</span>></span></span></code></pre>
<hr>
<h2 id="jquery ">jQuery </h2>
<p>jQuery jQuery DOM ， jQuery 。jQuery DOM ，DOM jQuery 。</p>
<h3 id="1jquery dom ">1、jQuery DOM </h3>
<p>jQuery jQuery DOM 。</p>
<ul>
<li>Query ， [index] 。</li>
</ul>
<pre class="prettyprint"><code class="language-javascript hljs "> <span class="hljs-keyword">var</span> $cr = $(<span class="hljs-string">"#cr"</span>); <span class="hljs-comment">//jQuery </span>
<span class="hljs-keyword">var</span> cr = $cr[<span class="hljs-number">0</span>]; <span class="hljs-comment">//DOM </span></code></pre>
<ul>
<li>jQuery ， get(index) DOM 。</li>
</ul>
<pre class="prettyprint"><code class=" hljs php"> <span class="hljs-keyword">var</span> <span class="hljs-variable">$cr</span> = $(<span class="hljs-string">"#cr"</span>); <span class="hljs-comment">//jQuery </span>
<span class="hljs-keyword">var</span> cr = <span class="hljs-variable">$cr</span>.get(<span class="hljs-number">0</span>); <span class="hljs-comment">//DOM </span></code></pre>
<h3 id="2dom jquery ">2、DOM jQuery </h3>
<p> DOM ， $() DOM jQuery 。</p>
<pre class="prettyprint"><code class=" hljs javascript"> <span class="hljs-keyword">var</span> cr = document.getELementById(<span class="hljs-string">"cr"</span>); <span class="hljs-comment">//DOM </span>
<span class="hljs-keyword">var</span> $cr = $(cr); <span class="hljs-comment">//jQuery </span></code></pre>
<hr>
<h2 id="jquery ">jQuery </h2>
<ol>
<li>jQuery ， <code>jQuery.noConflict()</code> </li>
<li>jQuery <br> ：</li>
</ol>
<pre class="prettyprint"><code class=" hljs javascript"> jQuery.noConflict(); <span class="hljs-comment">// $ prototype.js</span>
jQuery(<span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">($)</span>{</span> <span class="hljs-comment">// jQuery </span>
alert($(<span class="hljs-keyword">this</span>).text()); <span class="hljs-comment">// $() </span>
})</code></pre>
<p> ：</p>
<pre class="prettyprint"><code class=" hljs javascript"> jQuery.noConflict(); <span class="hljs-comment">// $ prototype.js</span>
(<span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">($)</span>{</span> <span class="hljs-comment">// $</span>
$(<span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">()</span>{</span> <span class="hljs-comment">// $ jQuery</span>
alert($(<span class="hljs-keyword">this</span>).text()); <span class="hljs-comment">// $() </span>
});
});</code></pre>
<hr>
<h2 id="jquery ">jQuery </h2>
<p>jquery CSS ， ，CSS ，jquery 。</p>
<blockquote>
<p> ： <br> 1. 。<code>$()</code> <code>document.getElementById()</code> 。 <br> 2. CSS1 CSS3 ， 。 <br> 3. 。 <code>getElementById()</code> ， > ， <code>$()</code> 。<code>$()</code> ， 。</p>
</blockquote>
<p> jQuery ， ， ：</p>
<pre class="prettyprint"><code class=" hljs ruby"> <span class="hljs-keyword">if</span>(<span class="hljs-variable">$(</span><span class="hljs-string">"#tt"</span>).length > <span class="hljs-number">0</span>){
<span class="hljs-regexp">//do</span> something
}</code></pre>
<p> DOM ， ：</p>
<pre class="prettyprint"><code class=" hljs ruby"> <span class="hljs-keyword">if</span>(<span class="hljs-variable">$(</span><span class="hljs-string">"#tt"</span>)[<span class="hljs-number">0</span>]){
<span class="hljs-regexp">//do</span> something
}</code></pre>
<h3 id=" "> 、 </h3>
<p> id、class DOM 。</p>
<table>
<thead>
<tr>
<th align="right"> </th>
<th align="center"> </th>
<th align="center"> </th>
<th align="center"> </th>
</tr>
</thead>
<tbody>
<tr>
<td align="right">id</td>
<td align="center"> id</td>
<td align="center"> </td>
<td align="center"><code>$("#test")</code></td>
</tr>
<tr>
<td align="right">.class</td>
<td align="center"> </td>
<td align="center"> </td>
<td align="center"><code>$(".test")</code></td>
</tr>
<tr>
<td align="right">element</td>
<td align="center"> </td>
<td align="center"> </td>
<td align="center"><code>$("p")</code></td>
</tr>
<tr>
<td align="right">*</td>
<td align="center"> </td>
<td align="center"> </td>
<td align="center"><code>$("*")</code> </td>
</tr>
<tr>
<td align="right"> </td>
<td align="center"> </td>
<td align="center"> </td>
<td align="center"><code>$("div,span,p")</code></td>
</tr>
</tbody>
</table>
<h3 id=" "> 、 </h3>
<p> DOM ， 、 、 </p>
<table>
<thead>
<tr>
<th align="center"> </th>
<th align="center"> </th>
<th align="center"> </th>
<th align="left"> </th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><span>$</span>(“ancestor descendant”)</td>
<td align="center"> ancestor descendant( ) </td>
<td align="center"> </td>
<td align="left"><code>$("div span")</code> div span </td>
</tr>
<tr>
<td align="center"><span>$</span>(“parent > child”)</td>
<td align="center"> parent child( ) </td>
<td align="center"> </td>
<td align="left"><code>$(div>span)</code> <span> </span></td>
</tr>
<tr>
<td align="center"><span>$</span>(“prev+next”)</td>
<td align="center"> prev next </td>
<td align="center"> </td>
<td align="left"><code>$(.one+div)</code> class one <code><div></code> , <code>$("one").next("div")</code></td>
</tr>
<tr>
<td align="center"><span>$</span>(“prev~siblings”)</td>
<td align="center"> prev siblings </td>
<td align="center"> </td>
<td align="left"><code>$("#two~div")</code> id two div , <code>$("two").nextAll("div")</code></td>
</tr>
</tbody>
</table>
<p>$(“prev~siblings”) ”prev” <code><div></code>， siblings() ， 。</p>
<pre class="prettyprint"><code class=" hljs ruby"> <span class="hljs-variable">$(</span><span class="hljs-string">".one ~ div"</span>).css(); <span class="hljs-regexp">//</span> .one div
<span class="hljs-variable">$(</span><span class="hljs-string">".one"</span>).nextAll(<span class="hljs-string">"div"</span>).css(); <span class="hljs-regexp">//</span> .one div
<span class="hljs-variable">$(</span><span class="hljs-string">".one"</span>).siblings(<span class="hljs-string">"div"</span>).css();<span class="hljs-regexp">//</span> .one div , </code></pre>
<h3 id=" "> 、 </h3>
<p> DOM ， CSS 。</p>
<p> ， ：</p>
<p> 1、 </p>
<p> 2、 </p>
<p> 3、 </p>
<p> 4、 </p>
<p> 5、 </p>
<p> 6、 </p>
<h4 id="1 ">1. </h4>
<p> ， ( ) 。</p>
<table>
<thead>
<tr>
<th> </th>
<th> </th>
<th> </th>
<th> </th>
</tr>
</thead>
<tbody>
<tr>
<td>:first</td>
<td> 1 </td>
<td> </td>
<td><span>$</span>(“div:first”) div </td>
</tr>
<tr>
<td>:last</td>
<td> 1 </td>
<td> </td>
<td><span>$</span>(“div:last”) </td>
</tr>
<tr>
<td>:not(selector)</td>
<td> </td>
<td> </td>
<td><span>$</span>(“input:not(.myClass)”) class myClass input </td>
</tr>
<tr>
<td>:even</td>
<td> ( 0 ) </td>
<td> </td>
<td><span>$</span>(“input:even”) input </td>
</tr>
<tr>
<td>:odd</td>
<td> ( 0 ) </td>
<td> </td>
<td><span>$</span>(“input:odd”) input </td>
</tr>
<tr>
<td>:eq(index)</td>
<td> ( 0 ) index </td>
<td> </td>
<td><span>$</span>(“input:eq(1)”) 1 input </td>
</tr>
<tr>
<td>:gt(index)</td>
<td> ( 0 ) index </td>
<td> </td>
<td><span>$</span>(“input:gt(1)”) 1 input </td>
</tr>
<tr>
<td>:lt(index)</td>
<td> ( 0 ) index </td>
<td> </td>
<td><span>$</span>(“input:lt(1)”) 1 input </td>
</tr>
<tr>
<td>:header</td>
<td> ， h1 h6</td>
<td> </td>
<td><span>$</span>(“:header”) </td>
</tr>
<tr>
<td>:animated</td>
<td> </td>
<td> </td>
<td><span>$</span>(“div:animated”) div </td>
</tr>
</tbody>
</table>
<h4 id="2 ">2. </h4>
<p> 。</p>
<table>
<thead>
<tr>
<th> </th>
<th> </th>
<th> </th>
<th> </th>
</tr>
</thead>
<tbody>
<tr>
<td>:contains(text)</td>
<td> text </td>
<td> </td>
<td><span>$</span>(“div:contains(‘test’)”) test </td>
</tr>
<tr>
<td>:empty</td>
<td> </td>
<td> </td>
<td><span>$</span>(“div:empty”) </td>
</tr>
<tr>
<td>:has(selector)</td>
<td> </td>
<td> </td>
<td><span>$</span>(“div:has(.myClass)”) class myClass </td>
</tr>
<tr>
<td>:parent</td>
<td> </td>
<td> </td>
<td><span>$</span>(“div:parent”) </td>
</tr>
</tbody>
</table>
<h4 id="3- ">3. </h4>
<p> 。 </p>
<table>
<thead>
<tr>
<th> </th>
<th> </th>
<th> </th>
<th> </th>
</tr>
</thead>
<tbody>
<tr>
<td>:hidden</td>
<td> </td>
<td> </td>
<td><span>$</span>(“div:hidden”) </td>
</tr>
<tr>
<td>:visible</td>
<td> </td>
<td> </td>
<td><span>$</span>(“div:visible”) </td>
</tr>
</tbody>
</table>
<p> ：hidden display none ， () visible:hidden 。 </p>
<h4 id="4 ">4. </h4>
<p> 。 </p>
<table>
<thead>
<tr>
<th> </th>
<th> </th>
<th> </th>
<th> </th>
</tr>
</thead>
<tbody>
<tr>
<td>[attribute]</td>
<td> </td>
<td> </td>
<td><span>$</span>(“div[id]”) id </td>
</tr>
<tr>
<td>[attribute=value]</td>
<td> value </td>
<td> </td>
<td><span>$</span>(“div[title=test]”) title test </td>
</tr>
<tr>
<td>[attribute!=value]</td>
<td> value </td>
<td> </td>
<td><span>$</span>(“div[title!=test]”) title test </td>
</tr>
<tr>
<td>[attribute^=value]</td>
<td> value </td>
<td> </td>
<td><span>$</span>(“div[title^=test]”) title test </td>
</tr>
<tr>
<td>[attribute<span>$</span>=value]</td>
<td> value </td>
<td> </td>
<td><span>$</span>(“div[title<span>$</span>=test]”) title test </td>
</tr>
<tr>
<td>[attribute*=value]</td>
<td> value </td>
<td> </td>
<td><span>$</span>(“div[title*=test]”) title test </td>
</tr>
<tr>
<td>[selector1][selector2]…[selectorN]</td>
<td> </td>
<td> </td>
<td><span>$</span>(“div[id][title*=test]”) id， title test </td>
</tr>
</tbody>
</table>
<p><code>[selector1] [selector2]…[selectorN]</code>， ， [selector1] A， A [selector2] B， B [selectorN] 。 </p>
<h4 id="5 ">5. </h4>
<p> 。</p>
<table>
<thead>
<tr>
<th> </th>
<th> </th>
<th> </th>
<th> </th>
</tr>
</thead>
<tbody>
<tr>
<td>:nth-child(index/even/odd/equation)</td>
<td> index( ) ，index 1 </td>
<td> </td>
<td><span>$</span>(“div:nth-child(1)”) </td>
</tr>
<tr>
<td>:first-child</td>
<td> 1 </td>
<td> </td>
<td><span>$</span>(“div :first-child”) </td>
</tr>
<tr>
<td>:last-child</td>
<td> 1 </td>
<td> </td>
<td><span>$</span>(“div :last-child”) </td>
</tr>
<tr>
<td>:only-child</td>
<td> </td>
<td> </td>
<td><span>$</span>(“div :only-child”) </td>
</tr>
</tbody>
</table>
<p> :nth-child()， ：</p>
<p> 1. nth-child(even) </p>
<p> 2. nth-child(odd) </p>
<p> 3. nth-child(2) 2 </p>
<p> 4. nth-child(3n) 3 ，n 0 </p>
<p> 5. nth-child(3n+1) (3n+1) ，n 0 </p>
<h4 id="6 ">6. </h4>
<p> 。</p>
<table>
<thead>
<tr>
<th> </th>
<th> </th>
<th> </th>
<th> </th>
</tr>
</thead>
<tbody>
<tr>
<td>:enabled</td>
<td> </td>
<td> </td>
<td><span>$</span>(“body:enabled”) </td>
</tr>
<tr>
<td>:disabled</td>
<td> </td>
<td> </td>
<td><span>$</span>(“body:disabled”) </td>
</tr>
<tr>
<td>:checked</td>
<td> ( 、 )</td>
<td> </td>
<td><span>$</span>(“input:checked”) input </td>
</tr>
<tr>
<td>:selected</td>
<td> ( )</td>
<td> </td>
<td><span>$</span>(“select:selected”) </td>
</tr>
</tbody>
</table>
<h3 id=" "> 、 </h3>
<p> ， | 。</p>
<table>
<thead>
<tr>
<th> </th>
<th> </th>
<th> </th>
<th> </th>
</tr>
</thead>
<tbody>
<tr>
<td>:input</td>
<td> <code>input</code>、<code>textarea</code>、<code>select</code> <code>button</code> </td>
<td> </td>
<td><span>$</span>(“:input”) <code>input</code>、<code>textarea</code>、<code>select</code> <code>button</code> </td>
</tr>
<tr>
<td>:text</td>
<td> </td>
<td> </td>
<td><span>$</span>(“:text”) </td>
</tr>
<tr>
<td>:password</td>
<td> </td>
<td> </td>
<td><span>$</span>(“:password”) </td>
</tr>
<tr>
<td>:radio</td>
<td> </td>
<td> </td>
<td><span>$</span>(“:radio”) </td>
</tr>
<tr>
<td>:checkbox</td>
<td> </td>
<td> </td>
<td><span>$</span>(“:checkbox”) </td>
</tr>
<tr>
<td>:submit</td>
<td> </td>
<td> </td>
<td><span>$</span>(“:submit”) </td>
</tr>
<tr>
<td>:image</td>
<td> </td>
<td> </td>
<td><span>$</span>(“:image”) </td>
</tr>
<tr>
<td>:reset</td>
<td> </td>
<td> </td>
<td><span>$</span>(“:reset”) </td>
</tr>
<tr>
<td>:button</td>
<td> </td>
<td> </td>
<td><span>$</span>(“:button”) </td>
</tr>
<tr>
<td>:file</td>
<td> </td>
<td> </td>
<td><span>$</span>(“:file”) </td>
</tr>
<tr>
<td>:hidden</td>
<td> </td>
<td> </td>
<td><span>$</span>(“:hidden”) </td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<!--PC WAP -->
<div id="SOHUCS" sid="1187896856210939904"></div>
<script type="text/javascript" src="/views/front/js/chanyan.js">
구태여 이럴 필요가 있는가
jsp 하이퍼링크 파일 다운로드 창가
bit1129
cluster
daizj
linux 설치하다. spark 1.4 배치하다
주범양
java 바이트 코드 javap
g21121
java
A형은 괴롭히지 않는다
finereport
담 위의 풀 한 포기.
aijuans
spring 사무 관리
A B C D E F G H I J K L M N O P Q R S T U V W X Y Z 기타
첫 페이지 -
우리 -
역내 수색 -
Sitemap -
권리 침해 신고
저작권 소유 IT 기술 자료 CopyRight© 2000-2050 IT Knowledgebase IT610.com , All Rights Reserved.
경ICP비09083238호
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Ajax 이용시 로컬 파일이 CORS 에러가 되었을 때의 대응초보의 초보로 입문편의 참고서를 보면서 공부하고 있어, Ajax에서 로컬 파일을 호출하려고했지만 CORS 정책 오류로 인해 실패했습니다. 브라우저에서 로컬 파일(html)을 표시한 것뿐. 사용 브라우저는 chrome...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
