*jQuery中设置或者获取所选内容的值：
text();设置或者获取所选元素的文本内容；

html();设置或者获取所选元素的内容（包括html标记）；

val();设置或者获取表单字段的值（前提是表单设置了value属性）；

(text()和html()的区别是：前者是处理的文本内容，只能写文本如果写了上面的标记则会以文本形式输出；后者可以解析文本中的html标记，就是你可以添加像<a></a>、<p></p>等标记，最后会解析为其效果。
)

*JavaScript中设置或者获取所选内容的值

同理innerText、innerHTML和value，

innerText和innerHTML都是将字符串放入hmtl标签中的一个函数
但是innerHTMl他可以解析hmtl标记
例如 你放入一个<a>斯蒂芬</a>  如果在DIV中它里面就会出现一个带下划线的a元素；
但是innerText只支持普通字符串；

*具体代码如下：
jQuery中：

<html>

<head>

<script src="/jquery/jquery-1.11.1.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>

JavaScript中：

<!DOCTYPE html>

<html>

<head>

<script src="/jquery/jquery-1.11.1.min.js"></script>

<script>

function getInnerHTML(){

alert(document.getElementById("btn1").value);

}

</script>

</head>

<body>

<p id="test">这是段落中的<b>粗体</b>文本。</p>

<button id="btn1"  onclick="getInnerHTML()"  >显示文本</button>

<button id="btn2">显示 HTML</button>

</body>

</html>

jQuery和JavaScript的区别总结：

*前者click事件是获取元素id进行处理；后者是onclick="getInnerHTML()";

*前者获取元素值时是text()；后者是innerText,无();设置值时，前者是text("jing"),后者是innerText="jing";

*注意:两者的设置时，会覆盖原有内容，如果想要插入，使用插入方法。

另：

.html()用为读取和修改元素的HTML标签    对应js中的innerHTML

.html()是用来读取元素的HTML内容（包括其Html标签）,.html()方法使用在多个元素上时，只读取第一个元素

.text()用来读取或修改元素的纯文本内容  对应js中的innerText

text()用来读取元素的纯文本内容，包括其后代元素;.text()方法不能使用在表单元素上

.val()用来读取或修改表单元素的value值

.val()是用来读取表单元素的"value"值,.val()只能使用在表单元素上

关于三者的区别

1. .val()方法和.html()相同，如果其应用在多个元素上时，只能读取第一个表单元素的"value"值，但是.text()和他们不一样，如果.text()应用在多个元素上时，将会读取所有选中元素的文本内容。

2 .html(),.text(),.val()都可以使用回调函数的返回值来动态的改变多个元素的内容。

jQuery中的text()、html()和val()以及innerText、innerHTML和value的更多相关文章

  1. JQuery中的text(),html()和val()区别

    定义和用法 text() 方法方法设置或返回被选元素的文本内容 代码如下 <!DOCTYPE html> <html lang="en"> <head ...

  2. JS中innerHTML、outerHTML、innerText 、outerText、value的区别与联系？jQuery中的text()、html()和val()

    一.JS中innerHTML.outerHTML.innerText .outerText.value的区别与联系?jS中设置或者获取所选内容的值:①innerHTML :属性设置或返回该标签内的HT ...

  3. jQuery中的text(),html(),val()用法

    jQuery中的text(),html(),val()用法 text():获取或者改变指定元素的文本 html():获取或改变指定元素的html元素以及文本 val():获取或者改变指定元素的valu ...

  4. jquery中html(), text(),val()区别(zhuan)

    https://zhidao.baidu.com/question/307317838.html http://www.cnblogs.com/aqbyygyyga/archive/2011/11/0 ...

  5. jQuery中的text(),html(),val()的区别

    一.jquery中HTML 1. 无参html() 方法用来获取任意元素的HTML内容,如果你调用多个选定元素的.html()方法,那么其读取的只是第一个元素,换句话说:如果选择器匹配多于一个的元素, ...

  6. jQuery中的text()、html()和val()以及javaScript中的innerText、innerHTML和value

    *jQuery中设置或者获取所选内容的值:text();设置或者获取所选元素的文本内容: html();设置或者获取所选元素的内容(包括html标记): val();设置或者获取表单字段的值(前提是表 ...

  7. jQuery中的text(),html(),val()有什么区别

    text():获取或者改变指定元素的文本html():获取或改变指定元素的html元素以及文本val():获取或者改变指定元素的value值(一般是表单元素) 以上3个都是jquery类库中的语法 第 ...

  8. js与jquery中html() text() val()中的区别

    首先html() text() val() 是jquery方法. 1.html()取得内容可以包含标签. 2.text()取得内容为元素文本内容. 3.val()只有value属性的元素才能使用该方法 ...

  9. jquery中html()/text()/val()区别

    html就是你可以添加<span></span><li></li>的标记text只能写文本如果写了上面的标记则会以文本形式输出,就是输出标签体的内容va ...

随机推荐

  1. MvvmLight ToolKit 教程

    MvvmLightToolKit MvvmLightToolKit的源代码是托管在CodePlex上的,我们 可以从这里获取最新版本的源代码,不仅源码,版本发布的日志,更改了哪些,修复了哪些,以及一些 ...

  2. Theano2.1.4-基础知识之图结构

    来自:http://deeplearning.net/software/theano/tutorial/symbolic_graphs.html Graph Structures Theano是将符号 ...

  3. PHP面向对象编程知识要点

    1.基本概念 1.1.面向对象的阶段概念 OOA:面向对象分析 OOD:面向对象设计 OOP:面向对象编程 1.2.类的概念 面向对象中的类,实质上就是现实世界中一类有着相似属性事物抽象的概括,像鸟类 ...

  4. SqlServer导入数据到MySql

    1.下载MySql ODBC Driver并进行安装.例如我下载的这个安装包是mysql-connector-odbc-5.1.6-win32.msi. 2.装完后,添加odbc数据源: 3.在sql ...

  5. js自定义事件

    自定义事件的本质,创建一个对象,然后把事件的名字作为对象的一个属性,然后value是一个[],把此事件的所以回调都push进去. 写一个很基本的,没有把对象暴露出去的js的自定义事件. var eve ...

  6. php file_get_contents失败[function.file-get-contents]: failed to open stream: HTTP request failed!解决

    在使用file_get_contents方法来获取远程文件时会出现 [function.file-get-contents]: failed to open stream: HTTP request ...

  7. alarm

    AlarmManager的使用机制有的称呼为全局定时器,有的称呼为闹钟.通过对它的使用,它的作用和Timer有点相似.都有两种相似的用法:(1)在指定时长后执行某项操作 (2)周期性的执行某项操作 在 ...

  8. C# 压缩与解压字符串（面试题）

    /* * 题目:压缩字符串.如“abbcccddddeef”,压缩成“a1b2c3d4e2f1” * 解题: 这个题目也是面试常见的题目.看似很简单,其实暗藏杀机.一般的想法就是,一边遍历,一边计数, ...

  9. 消息队列写入内容后，读出来的自动包裹了<string>标签，自定义格式化器解决该issue

    /// <summary> /// 该格式化器使输入即输出 /// </summary> public class StringFormatter : IMessageForm ...

  10. Java GC收集器配置说明

    根据Java GC收集器具体分类,我们可以看出JVM根据需求不同提供了三种选择:串行收集器.并行收集器.并发收集器. 串行收集器只适用于小数据量的情况,我们主要了解一下并行收集器和并发收集器.默认情况 ...