>  기사  >  웹 프론트엔드  >  JQuery API 2부로 Jquery 배우기 Properties_jquery

JQuery API 2부로 Jquery 배우기 Properties_jquery

WBOY
WBOY원래의
2016-05-16 18:29:521116검색

노드 속성, 내용, 텍스트를 변경해야 하는 경우가 많기 때문에 여기서는 여러 기능을 사용해야 합니다. 여기서 말씀드리고 싶은 것은 Jquery에도 그런 설계가 있다는 것입니다. 객체의 값을 얻어서 할당하는 데에도 동일한 함수가 사용됩니다. 객체에 값을 할당하려면 fn(name)을 사용하고 객체에 값을 할당하려면 fn(name, value)을 사용합니다.
먼저 attr(name)이 속성 값을 얻는 방법을 살펴보세요우리는

이러한 방식으로 img에서 stc의 값을 얻으려고 합니다. 먼저 선택기를 사용하여 선택합니다. img $ ("img")는 위의 노드를 얻은 다음 attr()을 사용하여 src의 값을 얻습니다. $("img").attr("src")
이런 방식으로 우리는 값을 얻습니다. of 1.jpg

이제 1.jpg 이미지를 2.jpg 이미지로 바꾸려고 합니다. $("img").attr("src","2.jpg")를 사용하면 됩니다. fn(이름, 키)입니다. 예를 들어 JavaScript에서는 onclick이 함수일 수 있으므로 키도 $("img") 함수일 수 있습니다. attr("src”, function(){return '3.jpg'}) 이는 두 번째 형식으로 실제로는 첫 번째 형식과 동일합니다 JQuery API 2부로 Jquery 배우기 Properties_jquery 세 번째 형식, 즉 attr(속성)은 이름: value는 속성을 할당하는 데 사용됩니다. Jquery에서는 이 방법이 매우 일반적으로 사용되며 구조도 매우 명확합니다.
예를 들어 img의 alt 및 src를 설정하려면 직접 할 수 있습니다. $("img").attr( {src:”4.jpg”,alt:”Description”})
일반적으로 시스템을 구축할 때에는 추가, 수정, 삭제를 해야 합니다. 이전에 처음 두 가지에 대해 이야기했는데 속성을 삭제하는 방법은 무엇입니까?
여기서는 이해하기 쉬운 RemoveAttr(name)을 사용해야 합니다. 하나는 get입니다. 다른 하나는 속성을 삭제하는 것입니다. $("img").removeAttr("alt")

자, 속성을 조작하기 위한 여러 함수를 요약해 보겠습니다.
검색: $("img ").attr("src") src 값 찾기
$(“img”).attr(“src”,”2.jpg”) $(“img”).attr(“src 추가/수정 ”,function(){return “2 .jpg"}) $("img").attr({src:"2.jpg"})
$("img").removeAttr("src") 삭제

2 CSS 클래스




와 같은 노드에 CSS 스타일을 추가해야 하는 경우
위 속성 방법에 따라 먼저 CSS를 추가합니다. 클래스 스타일 .sty{...}를 작성하고, 이 div를 선택하고 $("div").attr("class","sty") 클래스를 추가합니다. ,
나중에 이것도 맞는지 알아냈습니다. 번거로워서 위의

$("div").addClass("sty")를 줄여서 addClass(class)를 발명했고 그게 전부입니다.
추가되었으니 당연히 sty 클래스를 삭제하려면 $("div").removeClass("sty")를 삭제하는 것이 불가피합니다

toggleClass(class) 함수도 있는데, 존재하면 삭제하고, 존재하지 않으면 삭제하고 추가하면 됩니다.
참으로 이상한 기능입니다. 예를 들어 우리는 1인 그룹입니다.








  • li에서 마우스 입력과 마우스 이동 모두에 이 기능을 추가하면 마우스 이동 효과를 얻을 수 있습니다

  • 3 html

여기에는 앞서 언급한 함수 유형인 html()과 html(val)이 있습니다. fn(name) fn(name, value)
Html( )는 첫 번째 일치 요소의 html 클래스 콘텐츠를 가져옵니다.
Html(val)은 일치하는 노드의 html 클래스 콘텐츠를 설정하는 것입니다.
4개의 텍스트

도 있습니다. 여기서 두 가지 함수 text() text(val) 하나는 값을 가져오는 것이고 다른 하나는 값을 설정하는 것입니다.
값의 차이점은 html()이 html 클래스 내용을 취한다는 것입니다. 일치하는 첫 번째 요소이며 text는 얻은 텍스트입니다. html 노드
가 무시되고 값이 할당되면 text()는
과 같은 html 클래스 콘텐츠를 텍스트로 변환하고 html()은 여전히 html 요소로 해석됩니다


5 value 여기에는 여전히 동일한 val() 및 val(val)이 있습니다. 하나는 값을 가져오는 것이고 다른 하나는 값을 가져오는 것입니다. 예를 들어

이 값을 일부 텍스트로 가져옵니다. $("input").val () 이 값을 설정합니다. $("input").val("xxiu" )

여기서 속성을 살펴본 결과 몇 가지 함수만 살펴본 것으로 나타났습니다.
attr(name[,val,|fn]) RemoveAttr(name) 삭제할 설정 추가 속성
addClass(class) RemoveClass(class) 클래스 삭제를 위한 설정 추가
html([val]) heml 가져오기/설정
text([val]) 텍스트 가져오기/설정
val([val]) 값을 가져오거나 설정합니다.
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.