jQuery属性--html([val|fn])、text([val|fn])和val([val|fn|arr])
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])的更多相关文章
- jQuery 属性操作attr().prop().text().html().val()
这些方法用于获取和设置 DOM 元素的属性. 一.attr(): <!--样式:在style里面写的,用css来操作.--> <!--属性:在元素里面写的,用attr方法操作.--& ...
- jQuery属性操作之.val()函数
目录 .val()实例方法的三种用法 .val()函数源码 调用形式:$('xxx').val(); 调用形式:$('xxx').val(value); 调用形式:$('xxx').val(funct ...
- jQuery源码-dom操作之jQuery.fn.text
写在前面 jQuery.fn.text在jQuery是个使用频率比较高的接口,它的作用无非是设置/获取dom节点的内容文本,下文会通过几个简单的例子来说明.text()接口的使用,以及最后会对源码进行 ...
- jQuery 属性操作 - val() 方法
val() 方法返回或设置被选元素的值. 元素的值是通过 value 属性设置的.该方法大多用于 input 元素. 如果该方法未设置参数,则返回被选元素的当前值. <html> < ...
- 【jQuery源码】html,text,val
jQuery封装的方法html,text,val .html()用为读取和修改元素的HTML标签 .text()用来读取或修改元素的纯文本内容 .val()用来读取或修改表单元素的value值 一.h ...
- [转载]jQuery中的html,val,text区别
在jquery中 text() 返回目标元素所包含的所有文本内容,注意不包含html标签 alert($("#shuru").text()); 1 html() 返回目标元素所包含 ...
- jQuery中val()、text()、html()之间的差别
一.括号里没有值时表示取值 val获取表单中的值: text获取对象中的文本内容,不包含html标签: html获取对象中的内容,包括html标签 <!DOCTYPE HTML> & ...
- jQuery学习之------html()、text()和val()
jQuery学习之------html().text()和val() .html(),.text()和.val()的差异总结: (来源:慕课网) .html(),.text(),.val()三种方法 ...
- jquery val() and text().
.val() works on input elements (or any element with a value attribute?) and .text() will not work on ...
- jQuery 请指出'$'和'$.fn'的区别?或者说出'$.fn'的用途。
---------------------------------------------------------------------------------- 我们先把jQuery看成了一个类, ...
随机推荐
- python摸爬滚打之day14----内置函数,递归函数
1.匿名函数 用一句话实现的简单函数. ret = lambda x : x ** 2 即 函数名 = lambda 形参 : 返回值 print(ret(5)) ----> 25 ...
- Feature如何解决参数数量不匹配
问题描述: Feature 写了两个参数,匹配到Steps.Java, 文件只写了两个参数,但是两个参数都加了$ 符号. 而$ 又是结束的意思. 1一:Feature 用例
- HTN规划 jshop2
http://www.cs.umd.edu/projects/shop/description.html 在HTN规划,规划体系从世界的初始状态和创建一个计划来执行一系列任务的目的(需要做的事情,抽象 ...
- 使用 HTMLTestRunner 模块生成HTML格式的测试报告文件
1.下载HTMLTestRunner.py HTMLTestRunner 是 Python 标准库的 unittest 模块的一个扩展.它生成易于使用的 HTML 测试报告.HTMLTestRunne ...
- 【剑指offer】部分思路整理
题目 LL今天心情特别好,因为他去买了一副扑克牌,发现里面居然有2个大王,2个小王(一副牌原本是54张^_^)...他随机从中抽出了5张牌,想测测自己的手气,看看能不能抽到顺子,如果抽到的话,他决定去 ...
- .NET 三层框架
1.三层架构 三层架构(3-tier architecture) 通常意义上的三层架构就是将整个业务应用划分为:表现层(Presentation layer).业务逻辑层(Business Logic ...
- Redis入门到高可用(三)——通用命令
通用命令 参考 http://redisdoc.com/index.html 1. keys #查看所有key 时间复杂度:O(N), N 为数据库中 key 的数量. 127.0.0.1:637 ...
- 前端ps部分
一. 使用ps前的一些设置工作 1.首选项的设置 编剧-首选项-单位与标尺-[标尺/文字]改为像素 2.面板的设置 窗口--仅保留常用的[F7图层].[F8信息].[历史记录]. 3.视图的设置 视图 ...
- Spring MVC定时服务
spring-mvc-config.xml <context:component-scan base-package="com.bf" ></context:co ...
- Python 命名笔记
类名开头大写,驼峰命名 函数名,变量名都小写, 全局常量 如COUNT, 使用全部大写 https://www.cnblogs.com/lytwajue/p/7324724.html 这个是全局变量关 ...