html([val|fn])

概述

取得第一个匹配元素的html内容，这个函数不能用于XML文档。但可以用于XHTML文档。

在一个 HTML 文档中, 我们可以使用 .html() 方法来获取任意一个元素的内容。 如果选择器匹配多于一个的元素，那么只有第一个匹配元素的 HTML 内容会被获取

参数

val  用于设定HTML内容的值；function(index,html)  此函数返回一个HTML字符串。接受两个参数，index为元素在集合中的索引位置，html为原先的HTML值

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>

        <script type="text/javascript">

            $(document).ready(function() {

                $("p:eq(0)").click(function() {

                    alert($(this).html());

                });

                $("p:eq(1)").click(function() {

                    $(this).html("<a href='#'>第二个段落内容已换。<a>");

                });

                $("p:eq(2)").click(function() {

                    $(this).html(function(){

                        return "简单一点就好！";

                    });

                });

            })

        </script>

    </head>

    <body>

        <p><a>第一个段落。</a></p>

        <p>第二个段落。</p>

        <p>第三个段落。</p>

    </body>

</html>
 

text([val|fn])

概述

取得所有匹配元素的内容。结果是由所有匹配元素包含的文本内容组合起来的文本。这个方法对HTML和XML文档都有效

参数

val  用于设置元素内容的文本。function(index,text)  此函数返回一个字符串。接受两个参数，index为元素在集合中的索引位置，text为原先的text值

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>

        <script type="text/javascript">

            $(document).ready(function() {

                $("p:eq(0)").click(function() {

                    alert($(this).text());

                });

                $("p:eq(1)").click(function() {

                    $(this).text("<a href='#'>第二个段落内容已换。<a>");

                });

                $("p:eq(2)").click(function() {

                    $(this).text(function(){

                        return "简单一点就好！";

                    });

                });

            })

        </script>

    </head>

    <body>

        <p><a>第一个段落。</a></p>

        <p>第二个段落。</p>

        <p>第三个段落。</p>

    </body>

</html>
 

val([val|fn|arr])

概述

获得匹配元素的当前值

参数

val  要设置的值；function(index,value)  此函数返回一个要设置的值。接受两个参数，index为元素在集合中的索引位置，text为原先的text值

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>

        <script type="text/javascript">

            $(document).ready(function() {

                $("button").click(function(){

                    alert($("input:eq(0)").val());

                    $("input:eq(1)").val("测试二")

                });

            })

        </script>

    </head>

    <body>

        测试一：<input type="text" value="测试一"/><br />

        测试二：<input type="text" />

        <button>点击</button>

    </body>

</html>

jQuery属性--html([val|fn])、text([val|fn])和val([val|fn|arr])的更多相关文章

  1. jQuery 属性操作attr().prop().text().html().val()

    这些方法用于获取和设置 DOM 元素的属性. 一.attr(): <!--样式:在style里面写的,用css来操作.--> <!--属性:在元素里面写的,用attr方法操作.--& ...

  2. jQuery属性操作之.val()函数

    目录 .val()实例方法的三种用法 .val()函数源码 调用形式:$('xxx').val(); 调用形式:$('xxx').val(value); 调用形式:$('xxx').val(funct ...

  3. jQuery源码-dom操作之jQuery.fn.text

    写在前面 jQuery.fn.text在jQuery是个使用频率比较高的接口,它的作用无非是设置/获取dom节点的内容文本,下文会通过几个简单的例子来说明.text()接口的使用,以及最后会对源码进行 ...

  4. jQuery 属性操作 - val() 方法

    val() 方法返回或设置被选元素的值. 元素的值是通过 value 属性设置的.该方法大多用于 input 元素. 如果该方法未设置参数,则返回被选元素的当前值. <html> < ...

  5. 【jQuery源码】html,text,val

    jQuery封装的方法html,text,val .html()用为读取和修改元素的HTML标签 .text()用来读取或修改元素的纯文本内容 .val()用来读取或修改表单元素的value值 一.h ...

  6. [转载]jQuery中的html，val，text区别

    在jquery中 text() 返回目标元素所包含的所有文本内容,注意不包含html标签 alert($("#shuru").text()); 1 html() 返回目标元素所包含 ...

  7. jQuery中val()、text()、html()之间的差别

    一.括号里没有值时表示取值    val获取表单中的值: text获取对象中的文本内容,不包含html标签: html获取对象中的内容,包括html标签 <!DOCTYPE HTML> & ...

  8. jQuery学习之------html()、text()和val()

    jQuery学习之------html().text()和val() .html(),.text()和.val()的差异总结:  (来源:慕课网) .html(),.text(),.val()三种方法 ...

  9. jquery val() and text().

    .val() works on input elements (or any element with a value attribute?) and .text() will not work on ...

  10. jQuery 请指出'$'和'$.fn'的区别？或者说出'$.fn'的用途。

    ---------------------------------------------------------------------------------- 我们先把jQuery看成了一个类, ...

随机推荐

  1. 预备作业2 ：学习基础和C语言基础调查

    剑网三毒经pk心得: 看完标题的你真的没有进错,这里是博客园. 想到写这篇文章的原因一部分是自己的确没啥技能比超过90%以上的人还好,还有一部分是受到了作业提示的指引...... 如果你有类似的技能获 ...

  2. tensorflow入门笔记（四） tf.summary 模块

    模块内的函数: tf.summary.audio(name, tensor, sample_rate, max_outputs=3, collections=None, family=None) 输出 ...

  3. Javascript 面向对象编程（一）：封装 作者：yuan一峰

    学习Javascript,最难的地方是什么? 我觉得,Object(对象)最难.因为Javascript的Object模型很独特,和其他语言都不一样,初学者不容易掌握. 下面就是我的学习笔记,希望对大 ...

  4. SQL Server的一些小问题

    一.SQL Server远程调用失败 解决办法:在控制面板-程序和功能中卸载“Microsoft SQL Server 2012 Express LocalDB”,具体版本根据你安装的VS版本决定,我 ...

  5. 跨域的问题（nginx解决才是王道）

    跨域分为两类:一时get跨域,而是post跨域.常见的是三种: 一种是jsonp, $.ajax({ url: "http://127.0.0.1/~chenjiebin/mycode/ph ...

  6. sed命令 windows与linux换行

    Linux的Bash命令中有一个sed操作,SSD的create_list.sh中有用到这个操作: 结合着下面这个解释: 也就是删除所有行里面的以VOC2007/Annotations/(这里的\代表 ...

  7. SmokePing介绍

    一.SmokePing是什么? smokeping是rrdtool的作者Tobi Oetiker的作品,用Perl语言写的,主要是监视网络性能,所以它在图形显示方面有很大优势,也是一个很有特点的ope ...

  8. mysqldump备份数据出错

    收到nagios报警,提示mysql备份失败,线上使用的是逻辑备份,也就是使用mysqldump,由于数据比较小,也就没在乎速度神马的问题.好吧,那就查查是什么原因导致备份失败,由于备份是写成脚本定时 ...

  9. InnoDB体系架构

    MySQL支持插件式存储引擎,常用的存储引擎则是MyISAM和InnoDB,通常在OLTP(Online Transaction Processing 在线事务处理)中,我们选择使用InnoDB,所以 ...

  10. MySQL忘记root密码--不重启mysqd重置root密码

    先提个问题:如何不重启mysqld,且没有权限修改用户账号和权限的情况下,如何重新设置root密码?不知道没关系,在此之前我也是不知道如何操作的,先看看下面的几种重置root密码的方法. 1.skip ...