jq의 each 이해
<ul class="one">
<li>11ali>
<li>22bli>
<li>33cli>
<li>44dli>
<li>55eli>
ul>
<button> li button>
<script>
// 1 each li li
$("button").click(function(){
$(".one > li").each(function(){
// li
console.log($(this).text());
})
});
script>2종은 each를 통해 리에게 $(this)를 통해 모든 리에게 이벤트를 추가합니다
<ul class="two">
<li>2222li>
<li>22bli>
<li>3333li>
<li>44dli>
<li>5555li>
ul>
<script>
// 2 each li $(this) li
$('.two > li').each(function(index) {
console.log(index +":" + $(this).text());
// li click
$(this).click(function(){
alert($(this).text());
$(this).css("background","#fe4365");
});
});
script>4가지 모든 li를 훑어보고 모든 li에class 클래스를 추가합니다
<ul class="ctn3">
<li>Eatli>
<li>Sleepli>
<li>3 li>
ul>
<span> 3span>
<script>
// 4 li li class
$('span').click(function(){
$('.ctn3 > li').each(function(){
$(this).toggleClass('example');
})
});
script>5가지 each () 순환에서 element = = $(this)
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>each 2title>
<style>
div {
width: 40px;
height: 40px;
margin: 5px;
float: left;
border: 2px blue solid;
text-align: center;
}
span {
width: 40px;
height: 40px;
color: red;
}
style>
head>
<body>
<div>div>
<div>div>
<div>div>
<div id="stop">Stop herediv>
<div>div>
<div>div>
<button>Change colorsbutton>
<span>span>
body>
<script src="jquery-1.11.1.min.js">script>
<script >
// each() element == $(this)
$('button').click(function(){
$('div').each(function(index,element){
//element == this;
$(element).css("background","yellow");
if( $(this).is("#stop")){
$('span').text("index :" + index);
return false;
}
})
})
script>
html>이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
