`

jquery获取文档内容操作text()和html()对比

 
阅读更多
1.text() 方法返回或设置被选元素的内容,HTML 标签会被转义

<p>This is a paragraph.</p>

$("p").text(); //获取p的文本,结果:段落1


也可以设置文本内容:当该方法用于设置值时,它会覆盖被选元素的所有内容。
$("p").text("Hello <b>world</b>!"); //重写p的内容

结果:



2.html()  返回或设置被选元素的内容

***无参数时--用于获取值,该方法仅返回第一个匹配元素的内容。
***有参数时--用户设置值,该方法设置所有匹配元素的内容。

<p>This is a paragraph.</p>
<p>This is a paragraph2.</p>

$("p").html(); //结果:<b>段落1</b>


$("p").html("Hello <b>world!</b>");

结果:


结论:通过例子知道,html()方法与text()方法的区别就在于对html标签的识别上不同
  • 大小: 529 Bytes
  • 大小: 625 Bytes
  • 大小: 516 Bytes
分享到:
评论

相关推荐

    jquery入门培训文档

    - **能做什么**:jQuery可以用于创建插件、获取和修改页面内容、响应用户交互、实现平滑动画以及无刷新的Ajax通信。此外,它还优化了JavaScript的基本结构,如迭代和数组操作。 - **与其他JavaScript库的对比**:...

    jquery 归纳总结以及文档介绍

    5. **插入内容**: 使用 `.html()`, `.append()`, `.prepend()`, `.before()`, `.after()` 方法可以插入、替换或获取元素的内容。 **事件处理** 1. **绑定事件**: 使用 `.on()` 方法可以为元素绑定事件,如 `$("#...

    JQuery帮助文档

    jQuery简化了获取和操作DOM元素的方式。例如,获取元素的文本内容: ```javascript var text = $("#example").text(); ``` 设置元素的HTML内容: ```javascript $("#example").html("新的内容&lt;/p&gt;"); ``` ### 4. ...

    jQuery1.2API文档

    `html()`和`text()`分别用于获取或设置元素的HTML内容和纯文本内容。`attr()`用于获取或设置元素属性,如`$("a").attr("href", "http://example.com")`会改变所有a链接的目标URL。 ### 三、事件处理(Event ...

    jQuery中表格操作

    例如,要更改第一个单元格的内容和背景色,可以这样写: ```javascript $('table td:first').text('新文本').css('background-color', 'yellow'); ``` 对比于ASP.NET中的GridView,jQuery的表格操作更为灵活,无需...

    jquery_js 对比计算器习作

    比如,`append()` 和 `prepend()` 可用于在元素内部添加内容,`html()` 或 `text()` 用于设置或获取元素的HTML或纯文本内容。在这个LED灯计算器中,可能会使用这些方法来动态显示计算结果或用户输入。 事件处理是...

    jquery-3.4.1.rar

    jQuery是由John Resig创建的一个轻量级的JavaScript库,它的目标是简化HTML文档遍历、事件处理、动画和Ajax交互。jQuery的核心理念是"Write Less, Do More",通过提供简单易用的接口,使得复杂的DOM操作、事件绑定和...

    jQuery 类库以及使用说明

    4. DOM操作:`.html()`用于获取或设置元素的HTML内容,`.text()`处理文本内容,`.val()`用于表单元素的值。 5. 事件处理:`.on()`是jQuery的主要事件绑定函数,可以绑定多种类型的事件,如`$("#myButton").on(...

    jquery复选框产品对比功能

    总的来说,"jquery复选框产品对比功能"是一个结合了HTML、CSS和jQuery的项目,通过复选框交互、DOM操作、事件处理和数据存储等多个技术点,实现了电商网站常见的产品比较功能。这个项目不仅能够锻炼开发者对jQuery的...

    jQuery入门

    通过对比两种方式下的代码量和语法差异,可以直观感受到jQuery带来的便利性。 ```html &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;title&gt;jQuery示例 &lt;!-- 引入jQuery文件 --&gt; &lt;script type="text/javascript" src="js/...

    Jquery资料

    你可以使用`.append()`将内容添加到元素内部,`.remove()`删除元素,`.html()`和`.text()`用来设置或获取元素的HTML内容和纯文本。 **三、事件处理** jQuery简化了事件绑定的过程。`.click()`、`.mouseover()`等...

    jQuery个人总结

    - **API 对比**:与原生 JavaScript 相比,jQuery 提供了一套更加简洁和易于使用的 API。例如,使用原生 JavaScript 获取元素的方式为 `document.getElementById('elementId')`,而在 jQuery 中则简化为 `$('#...

    jquery日期选择插件

    开发者需要在HTML中正确放置这些元素,并赋予适当的ID或类名以便于jQuery选择和操作。 2. **jQuery选择器和事件**:在JavaScript代码中,开发者会使用jQuery选择器找到HTML元素,然后绑定事件监听器,如`click`事件...

    jquery 讲课

    3. **DOM操作(DOM Manipulation)**:jQuery提供了丰富的API来操作DOM,如`append()`用于在元素内部追加内容,`remove()`用于删除元素,`html()`用于获取或设置元素的HTML内容。 4. **事件处理(Event Handling)*...

    JQuery入门

    - DOM操作: `append()`, `prepend()`, `html()`, `text()`等用于操作元素内容。 - 事件处理: `on()`, `off()`, `click()`, `mouseover()`等用于事件绑定和解绑。 - 动画效果: `fadeIn()`, `fadeOut()`, `slideToggle...

    jquery 颜色插件 picker

    为了更好地利用jQuery Color Picker,开发者可以参考其官方文档或社区资源,了解更多的配置选项和使用技巧。同时,也可以探索其他类似的颜色选择插件,比如Bootstrap Colorpicker或Spectrum,以便对比和选择最适合...

    jquery 笔记精要

    ### jQuery 笔记精要点梳理 ...通过上述内容的学习,我们了解到jQuery不仅简化了JavaScript的开发流程,而且提供了一系列丰富的功能和便捷的操作方式。掌握jQuery的基本用法和API,将极大提升前端开发的效率和质量。

    15天学会jquery

    - **定义**:jQuery是一个开源JavaScript库,旨在简化HTML文档遍历、事件处理、动画及与Ajax交互等操作。 - **特点**:通过简洁的语法提供了强大的功能,使得开发者可以用更少的代码实现更多复杂的效果。 - **优势**...

    JQuery基础、选择器.docx

    1. **DOM操作**:jQuery 提供了类似 CSS 的选择器,使得选取和操作DOM元素变得极其简单,如 `$("#id")` 或 `$(".class")`。 2. **CSS控制**:jQuery 可以轻松改变元素的样式,如 `.css("property", "value")`。 3....

    jQuery 教程 源码+实例+注释 [新手入门提高速成]

    2. **DOM操作**:jQuery 提供了 `$(selector).html()`,`$(selector).text()`,`$(selector).append()` 等方法,用于修改或获取元素的 HTML 内容、文本内容,以及向元素内部添加内容。 3. **事件处理**:jQuery 的...

Global site tag (gtag.js) - Google Analytics