>웹 프론트엔드 >JS 튜토리얼 >jquery 요소 콘텐츠: html(), text(), val()

jquery 요소 콘텐츠: html(), text(), val()

无忌哥哥
无忌哥哥원래의
2018-06-29 14:09:041545검색

jquery 요소 내용: html(), text(), val()

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>元素的内容: html(),text(),val()</title>
</head>
<body>
<div></div>
<form>
邮箱: <input type="text" name="email">
<button>提交</button>
</form>
</body>
</html>

html()은 attr(), css()와 동일하며 매개변수에 따라 자체 읽기 및 설정 기능이 있습니다

1 . 요소 콘텐츠를 설정합니다. 모든 콘텐츠를 포함할 수 있습니다. 기본 innerHTML 속성과 동일합니다.

텍스트 노드 만들기

var res = $(&#39;div&#39;).html(&#39;jQuery真的好方便&#39;)

요소 노드 만들기

var res = $(&#39;div&#39;).html(&#39;<h2>jQuery真的好方便</h2>&#39;)

요소 콘텐츠 가져오기

var res = $(&#39;div&#39;).html()

2. 요소: 기본과 유사 textContent 속성

은 단일 태그로 텍스트를 가져오고 하위 요소 태그 c1a436a314ed609750bd7c7d319db4da는 자동으로 필터링되어 텍스트 부분만 남깁니다.

var res = $(&#39;div&#39;).text()

요소 콘텐츠에 여러 개의 하위 요소가 있는 경우 요소, 이러한 하위 요소의 텍스트가 병합됩니다

var res = $(&#39;div&#39;).html(&#39;<h2>jQuery真的好方便</h2><p>大家要好好学</p>&#39;)

먼저 html() 출력을 살펴보겠습니다

var res = &#39;html()输出:&#39;+$(&#39;div&#39;).html()

그런 다음 text() 메서드를 사용하여 출력하고, 두 출력 결과를 비교하고, 다음 줄에 주의하세요. n

res += &#39;\n&#39; + &#39;text()输出:&#39; + $(&#39;div&#39;).text()

text()를 사용하여 콘솔에서 중단합니다. 매개변수가 있는 경우 설정 작업입니다

var res = $(&#39;div&#39;).text(&#39;祝愿大家早日成为一名合格的Web开发程序员&#39;)

3. 양식 컨트롤에서 데이터를 가져오거나 설정합니다: val()의 값 속성과 동일합니다. 네이티브의 양식 요소

$(&#39;button&#39;).click(function(){

값 속성 값 읽기

alert($(&#39;:text&#39;).val())

값 속성 값 설정

$(':text').val('zhu@php.cn')
alert($(&#39;:text&#39;).val())
})

콘솔 결과 보기

console.log(res)

위 내용은 jquery 요소 콘텐츠: html(), text(), val()의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.