jQuery学习手册(14)

Posted designbyly

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery学习手册(14)相关的知识,希望对你有一定的参考价值。

html([val | fn])

和原生的js中的innerHTML一模一样

text([val | fn])

和原生的JS中的innerText一模一样

val([val | fn | arr])

*/

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

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
    </script>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        
        div {
            width: 100px;
            height: 100px;
            border: 3px solid paleturquoise;
        }
    </style>
    <title>Document</title>
</head>

<body>
    <button>设置html</button>
    <button>获取html</button>
    <button>设置text</button>
    <button>获取text</button>
    <button>设置value</button>
    <button>获取value</button>
    <input type="text">
    <script>
        $(function() {
            var btn = document.getElementsByTagName('button')
            btn[0].onclick = function() {
                $('div').html('<p>我是段落<span>我是span</span></p>')
            }
            btn[1].onclick = function() {
                console.log($('div').html())
            }
            btn[2].onclick = function() {
                $('div').text('<p>我是段落p<span>我是span</span></p>')
            }
            btn[3].onclick = function() {
                console.log($('div').text())
            }
            btn[4].onclick = function() {
                $('input').val('请输入内容')
            }
            btn[5].onclick = function() {
                console.log($('input').val())
            }
        })
    </script>
</body>

</html>

在这里插入图片描述
每日一句
对上级谦恭是本分,对平辈谦逊是和善,对下级谦逊是高贵,对所有人谦逊是安全。——亚里士多德

以上是关于jQuery学习手册(14)的主要内容,如果未能解决你的问题,请参考以下文章

jQuery学习手册(20)

JavaScript学习手册(14)

web前端开发JQuery常用实例代码片段(50个)

ES6学习手册(14)

jQuery学习手册(25)

jQuery学习手册