地址

  • text() - 设置或返回所选元素的文本内容
  • html() - 设置或返回所选元素的内容(包括 HTML 标记
  • val() - 设置或返回表单字段的值

一、text()  html()

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("#btn1").click(function(){
alert("Text: " + $("#test").text());
});
$("#btn2").click(function(){
alert("HTML: " + $("#test").html());
});
});
</script>
</head> <body>
<p id="test">这是段落中的 <b>粗体</b> 文本。</p>
<button id="btn1">显示文本</button>
<button id="btn2">显示 HTML</button>
</body>
</html>

二、val()

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
alert("值为: " + $("#test").val());
});
});
</script>
</head> <body>
<p>名称: <input type="text" id="test" value="菜鸟教程"></p>
<button>显示值</button>
</body>
</html>

val()也可以获得文本输入域 <textarea>的输入内容

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
alert("值为: " + $("#test").val());
});
});
</script>
</head> <body>
<textarea id="test"></textarea>
<button>显示值</button>
</body>
</html>

三、获取属性 attr()

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
alert($("#runoob").attr("href"));
});
});
</script>
</head> <body>
<p><a href="//www.runoob.com" id="runoob">菜鸟教程</a></p>
<button>显示 href 属性的值</button>
</body>
</html>

prop()函数的结果:

1.如果有相应的属性,返回指定属性值。

2.如果没有相应的属性,返回值是空字符串。

attr()函数的结果:

1.如果有相应的属性,返回指定属性值。

2.如果没有相应的属性,返回值是 undefined。

对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。

对于HTML元素我们自己自定义的DOM属性,在处理时,使用 attr 方法。

具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop()

jQuery 获得内容的更多相关文章

  1. jQuery - 设置内容和属性 设置内容 - text()、html() 以及 val() , 设置属性 - attr()

    jQuery - 设置内容和属性  设置内容 - text().html() 以及 val() text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元素的内容(包括 HTM ...

  2. jQuery div内容间隔1秒动态向上滚动HTML、JS代码

    demo1: <!DOCTYPE html> <html> <head> <title>div内容间隔1秒动态滚动</title> < ...

  3. jQuery - 设置内容和属性

    设置内容 - text().html() 以及 val() 我们将使用前一章中的三个相同的方法来设置内容: text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元素的内容( ...

  4. <七> jQuery 设置内容和属性

    设置内容 text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元素的内容(包括 HTML 标记) val() - 设置或返回表单字段的值 设置属性 jQuery attr( ...

  5. <六> jQuery 获得内容和属性

    获得内容 三个简单实用的用于 DOM 操作的 jQuery 方法: text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元素的内容(包括 HTML 标记) val() - ...

  6. jQuery - 获取内容和属性

    jQuery 拥有可操作 HTML 元素和属性的强大方法. jQuery DOM 操作 jQuery 中非常重要的部分,就是操作 DOM 的能力. jQuery 提供一系列与 DOM 相关的方法,这使 ...

  7. Jquery 概念性内容编辑器

      概念性jQuery内容编辑器,这是一款非常有特色的jQuery编辑器,该编辑器支持文字.列表.视频.引用等功能,是一款小巧简洁,富有个性化的jQuery内容编辑器插件. 代码: <!doct ...

  8. 黑马day16 jquery&amp;内容过滤选择器&amp;可见度选择器

    内容过滤选择器的过滤规则主要体如今它所包括的子元素和文本内容上 .:contains(text) 使用方法: $("div:contains('John')")    返回值  集 ...

  9. jquery获取内容和属性的方法

    通过jquery如何捕获文本内容和属性? text(),html(),val()及attr(). attr()更具有普遍性,元素text属性和表单value属性,可以通过attr()操作. <! ...

  10. jQuery学习- 内容选择器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. java 数组转list asList用法

    https://www.cnblogs.com/zheyangsan/p/6910476.html java中数组转list使用Arrays.asList(T... a)方法. 示例: public ...

  2. Linux双网口配置时重复配置DEFROUTE和GATEWAY

    配置一台机器时,沿袭了原有网口配置,修改网口名,把em1全部修改改为eth0 mv ifcfg-em1 ifcfg-eth0 mv ifcfg-em2 ifcfg-eth1 改完以后,机器变得不稳定, ...

  3. 我说CMMI之六:CMMI的评估--转载

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明.本文链接:https://blog.csdn.net/dylanren/article/deta ...

  4. k8sDeployment控制器

    简写为deploy,是k8s控制器的另一种实现,它构建于ReplicaSet之上,可为pod和rs资源提供声明式更新. deploy控制器资源的大部分功能均可通过调用rs来实现,同时,还增添了部分特性 ...

  5. 链接数据库模板 DataBaseLinkTool

    一. 1.Dao层 对数据库的底层操作  增删改查 package Dao; import java.sql.Connection; import java.sql.ResultSet; import ...

  6. 百度地图api,点击标注,改变标注marker图标的链接地址

    改变选中的图标样式 // 选中高亮标注图片 let mapIcon = ‘./icon.png’; //标注点 let markerArrs = [{},{},....]; // 点击标注点 mark ...

  7. 项目的Servlet类找不到

    先右击项目,

  8. Angular 应用的外壳

    你首先需要使用 Angular CLI 来创建一个初始化的应用.随后,你将对你已经初始化的应用进行修改来让你构建出 Tour of Heroes app(英雄指南) 这个应用. 在教程的本部分,你需要 ...

  9. oracle(转)

    Oracle数据库基本操作 1.概述 Oracle数据库客户端一般需要安装在服务器上,可以在服务器端操作,一般我们可以用sql developer工具远程连接到数据库,先行建立数据库,然后对表进行增删 ...

  10. EDA cheat sheet

    %config InlineBackend.figure_format = 'svg' 在jupyter notebook中使用这个命令绘制更清晰的图像,注意百分号后不能有空格. 1. Univari ...