jQuery-05-内容文本值操作

1.1 普通元素内容 html()

相当于原生inner HTML
html() // 获取元素的内容
html(''内容'') // 设置元素的内容

1.2 普通元素文本内容 text()

相当于原生 innerText
text() // 获取元素的文本内容
text(''文本内容'') // 设置元素的文本内容

1.3 表单的值 val()

相当于原生value
val() // 获取表单的值
val(''内容'') // 设置表单的值

1.4 demo

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="jquery.min.js"></script>
</head>

<body>
    <div>
        <span>我是内容</span>
    </div>
    <input type="text" value="请输入内容">
    <script>
        // 1. 获取设置元素内容 html()
        console.log($("div").html());
        // $("div").html("123");
        // 2. 获取设置元素文本内容 text()
        console.log($("div").text());
        $("div").text("123");

        // 3. 获取设置表单值 val()
        console.log($("input").val());
        $("input").val("123");
    </script>
</body>
</html>

jQuery-05-内容文本值操作

1.1 普通元素内容 html()

1.2 普通元素文本内容 text()

1.3 表单的值 val()

1.4 demo

相关文章