jquery element content: html(), text(), val()-JS Tutorial-php.cn

jquery element content: html(), text(), val()

无忌哥哥

Release： 2018-06-29 14:09:04

Original

1549 people have browsed it

jquery element content: 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>

Copy after login

html() is the same as attr(), css(), and has its own reading and setting functions depending on the parameters

1. Set element content, which can include any content: child elements or text, the same as the native innerHTML attribute

Create text node

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

Copy after login

Create element node

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

Copy after login

Get element content

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

Copy after login

2. Get the text content in the element: similar to the textContent attribute in the native

Get the text in a single label, the sub-element label< h2>Filter out, leaving only the text part

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

Copy after login

If the element content has multiple sub-elements, the text of these sub-elements will be merged

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

Copy after login

Let’s use html() output to take a look

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

Copy after login

Use the text() method to output again, compare the two output results, pay attention to the use of newlines in the console\n

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

Copy after login

If text() has parameters, it is a setting operation

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

Copy after login

3. Get or set the data in the form control: val(), which is equivalent to the value attribute of the form element in the native

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

Copy after login

Read the value of the value attribute

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

Copy after login

Set The value of the value attribute

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

Copy after login

Console view results

console.log(res)

Copy after login

The above is the detailed content of jquery element content: html(), text(), val(). For more information, please follow other related articles on the PHP Chinese website!