jquery练习8 html()与text()

来源:互联网 发布:喜马拉雅 兼职 知乎 编辑:程序博客网 时间:2024/06/18 17:35

原题及原生js解法

就是单纯比较一下html()和text()的区别.

html()把这个元素内所有东西,包括html标签都输出出来,而text只显示文本


代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head>    <meta http-equiv="Content-Type" content="text/html charset=utf-8" />    <script src="http://code.jquery.com/jquery-1.8.3.js">    </script>    <script type="text/javascript">    $(document).ready(function() {        $("#div1").click(function() {            alert(".html()内容:" + $("#div1").html());        });        $("#div2").click(function() {            alert(".text()内容:" + $("#div2").text());        });    });    </script>    <style type="text/css">    .wrapper {        margin: 0 auto;        /*text-align: center;*/    }    #div1 {        width: 500px;        height: 100px;        border: 1px solid black;        margin: 0 auto;        background: #00FFFF;    }    #div2 {        width: 500px;        height: 100px;        border: 1px solid black;        margin: 0 auto;        background: #00FF7F;    }    </style>    <title>        2.2 html() text() val()    </title></head><body>    <div class="wrapper">        <div id="div1">            <strong>新华网</strong> 新闻内容<strong>aaaa</strong></div>        <div id="div2"><strong>标题</strong> 新闻内容abc<strong>重点</strong></div>        <!--.val()多用于input标签,不设参数则返回当前值,设参数则修改当前值为参数-->    </div></body></html>