地址

  • 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. eclipse编码格式（中文乱码）

    https://jingyan.baidu.com/article/2009576193ee38cb0721b416.html 修改工作空间默认编码 1 进入Eclipse,导入一个项目工程,如果项目 ...

  2. django初步--+urls解析

    1.静态文件配置: 你在浏览器中输入网址能够有响应的资源返回给你 是因为后端已经提前给你开设该资源的接口,也就意味着你所能 访问到的资源 都是人家事先定义好的. 2.django如何给用户开设资源接口 ...

  3. Acwing-116-飞行员兄弟(二进制枚举)

    链接: https://www.acwing.com/problem/content/description/118/ 题意: "飞行员兄弟"这个游戏,需要玩家顺利的打开一个拥有1 ...

  4. python_多线程多进程

    多线程,适用于IO密集型任务 IO,input,output缩写,包括网路io(比如上传下载),磁盘io,(比如数据库读写),CPU操作不频繁 多进程,适用于CPU密集型任务 数据分析,算法,依赖CP ...

  5. eclipse - -解决复制的文件中文乱码问题

    Window->Preferences->Web->JSP Files 面板选择 ISO 10646/Unicode(UTF-8)

  6. 闰年计算——JavaScript 语言计算

    ㈠闰年是如何来的? 闰年(Leap Year)是为了弥补因人为历法规定造成的年度天数与地球实际公转周期的时间差而设立的.补上时间差的年份为闰年. ㈡什么是闰年? 凡阳历中有闰日(二月为二十九日)的年, ...

  7. 我在做评论功能时学到的js一些思路

    在提交评论的时候,如何判断是一级评论还是二级评论(因为都是通过一个文本域提交评论),思路:声明一个全局变量,如果是回复(二级评论)那么会触发点击回复事件,在这个事件的回调函数里给全局变量设置为true ...

  8. File类、FileInfo类、Directory类、DirectoryInfo类

    File类.Directory类,都是静态类,可以直接使用类名 FileInfo类.DirectoryInfo类,都是动态类,需要new对象,通过对象来操作 [文件的创建.复制.移动.删除]using ...

  9. Java多线程和并发（九），ReentrantLock（公平锁）

    目录 1.ReentrantLock 2.ReentrantLock的实现 3.synchronized和ReentrantLock的区别 九.ReentrantLock(公平锁) 1.Reentra ...

  10. python生成手机号

    """ 电信号段:133/153/180/181/189/177; 联通号段:130/131/132/155/156/185/186/145/175; 移动号段:134/ ...