<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
<title>JQ 获得和设置内容 text() 和 html() 和 val()</title>
</head>
<body>
<p id="cont"><span>茶韵</span>阅谁问君诵，水落清香浮。</p>
<input type="text" id="input" value="input的值">
<button id="btnText">text()</button>
<button id="btnHtml">html()</button>
<button id="btnVal">val()</button>
<script src="jquery-1.10.1.min.js"></script>
<script>
$(function(){
// $("#btnText").click(function(){
// alert($("#cont").text());
// //茶韵阅谁问君诵，水落清香浮。
// });
// $("#btnHtml").click(function(){
// alert($("#cont").html());
// //<span>茶韵</span>阅谁问君诵，水落清香浮。
// });
// $("#btnVal").click(function(){
// alert($("#input").val());
// //input的值
// });
$("#btnText").click(function(){
$("#cont").text("<span>域名</span>onestopweb.cn");
alert($("#cont").html());
});
$("#btnHtml").click(function(){
$("#cont").html("<span>域名</span>onestopweb.cn");
alert($("#cont").html());
});
$("#btnVal").click(function(){
$("#input").val("已经更新input的值");
alert($("#input").val());
});
})
</script>
</body>
</html>
效果图：
相关推荐
与`.html()`方法类似，`.text()`同样提供了获取和设置文本的功能。 对于表单元素的值，jQuery提供了`.val()`方法。这在处理用户输入或从表单中获取数据时非常有用： ```javascript // 获取元素的值 var inputValue...
在阅读博文《JQ 获取内容和属性》（链接：https://onestopweb.iteye.com/blog/2337789）时，可以配合实践，通过创建简单的HTML页面和使用jQuery代码，加深对这些知识点的理解。 以上就是关于jQuery获取内容和属性的...
`val()`方法用于获取或设置元素的值，如果与事件结合使用，可以在特定条件下改变元素的内容。 例如，如果我们希望当`myInput`获得焦点时自动填充一段默认文本，我们可以这样做： ```javascript $("#myInput").on(...
在jQuery中，`text()`, `val()`, 和 `html()` 是三个非常常用的函数，用于获取和设置HTML元素中的文本、值以及HTML内容。虽然它们的功能相似，但各自有着特定的用途和细微的区别。 首先，`text()` 主要用于获取或...
1. **获取text和textarea值**： - 对于`<input type="text">`和`<textarea>`，可以使用`.attr()`方法来获取它们的值。例如，对于一个id为`txt`的文本框，获取其值的代码为：`$("#txt").attr("value")`。 2. **设置...
"jQuery获取和设置文本框光标"这个主题是关于如何利用jQuery来控制HTML输入元素（如文本框）中的光标位置以及选定文本的操作。这在创建富文本编辑器、自定义表单组件或实现某些特殊交互时非常有用。 首先，让我们...
在本文中，我们将深入探讨如何使用jQuery（jq）来创建一个简单的input标签生成器，以及如何结合HTML和CSS实现这一功能。input标签是HTML中用于用户输入数据的基本元素，而jQuery则提供了一种方便的方式来处理DOM操作...
在前端开发中，使用 jQuery 框架能够极大地简化 DOM 操作，使得获取或设置 HTML 元素的属性变得更加容易。本篇文章将详细介绍如何利用 jQuery 来获取 Select 标签的值以及相关的表单元素操作。 #### 一、获取 ...
"JQ 表格内容过滤"是指利用jQuery库来实现对表格数据的筛选和过滤功能，提高用户交互体验。jQuery是一个强大的JavaScript库，它简化了HTML文档遍历、事件处理、动画以及Ajax交互。在本案例中，我们将探讨如何利用...
JQ提供了方便的DOM操作方法，如`append()`用于在元素内部添加内容，`prepend()`在元素内部前置内容，`remove()`删除匹配的元素，`html()`、`text()`和`val()`分别用于获取或设置元素的HTML内容、文本内容和表单字段...
在jQuery中，`html()`, `val()`, 和 `text()` 是三个常用的方法，它们用于获取和设置HTML元素中的内容。下面将详细解释这三个方法的联系与区别。 1. `html()` - 无参 `html()`：该方法用于获取匹配元素的第一个...
例如，`html()`用于获取或设置元素的HTML内容，`text()`用于获取或设置文本内容，`height()`和`width()`用于获取或设置元素的尺寸，`val()`用于获取或设置表单元素的值。这些方法在设置值时，会改变元素的相应属性；...
- **`text()`**: 获取或设置被选元素的文本内容（不包含HTML标签）。例如，`$("span").text("新文本");`会将所有`<span>`元素的文本内容替换为“新文本”。 - **`val()`**: 特别适用于表单元素，如输入框、下拉列表...
`，将标签内容设置为"Set Lbl Value"。 3. **单选按钮（Radio）** - 取值：可以使用`$("input[@type=radio][@checked]").val();`获取被选中的单选按钮的值。 - 赋值：要设置某个特定值的单选按钮为选中状态，可以...
可以使用`.val()`方法获取输入值，然后用`if`语句判断是否为空。 - 长度检查：可以设置最小和最大长度限制，例如账号8-20个字符，密码6-16个字符。使用字符串的`.length`属性进行验证。 - 特殊字符和数字检查：...
在JavaScript和jQuery的世界里，处理用户交互是常见的任务之一，特别是在网页表单中。"jq点击复选框触发事件给input赋值"这个主题聚焦于一个具体的案例：当用户点击复选框时，如何捕获该事件并根据选择更新相关的...
总的来说，jQuery提供了一种简洁的方式来操作HTML元素，包括获取和设置input的值。通过选择器选取元素，再配合`.val()`方法，可以轻松地实现与用户输入的互动。在实际项目中，结合DOM操作、事件处理和Ajax请求，...
如描述中所示，我们可以使用`val()`轻松获取或设置这些元素的值。以下是一个简单的示例： ```html <option>Single <option>Single2 <option selected="selected">Multiple <option>Multiple2 ...
jQuery提供了大量便利的API，如`.html()`（设置或获取元素的HTML内容），`.val()`（设置或获取表单元素的值），`.data()`（存储和读取元素关联的数据）等。 ### 9. 性能优化 理解jQuery的选择器效率、避免DOM操作...