JQuery获得内容和属性方法解析

jQuery 拥有可操作 HTML 元素和属性的强大方法。

jQuery DOM 操作

jQuery 中非常重要的部分，就是操作 DOM 的能力。

jQuery 提供一系列与 DOM 相关的方法，这使访问和操作元素和属性变得很容易。

提示：DOM = Document Object Model（文档对象模型）

DOM 定义访问 HTML 和 XML 文档的标准：

“W3C 文档对象模型独立于平台和语言的界面，允许程序和脚本动态访问和更新文档的内容、结构以及样式。”

获得内容 - text()、html() 以及 val()

三个简单实用的用于 DOM 操作的 jQuery 方法：

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

下面的例子演示如何通过 jQuery text() 和 html() 方法来获得内容：

实例

$("#btn1").click(function(){
alert("Text: " + $("#test").text());
});
$("#btn2").click(function(){
alert("HTML: " + $("#test").html());
});

下面的例子演示如何通过 jQuery val() 方法获得输入字段的值：

实例

$("#btn1").click(function(){
alert("Value: " + $("#test").val());
});

获取属性 - attr()

jQuery attr() 方法用于获取属性值。

下面的例子演示如何获得链接中 href 属性的值：

实例

$("button").click(function(){
alert($("#w3s").attr("href"));
});

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • jQuery获得内容和属性方法及示例

    获得内容 - text().html() 以及 val() 三个简单实用的用于 DOM 操作的 jQuery 方法: text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元素的内容(包括 HTML 标记) val() - 设置或返回表单字段的值 获取属性 - attr() jQuery attr() 方法用于获取属性值. 下面的例子演示如何获得链接中 href 属性的值: 实例 复制代码 代码如下: $("button").click(function(){

  • jQuery获取选中内容及设置元素属性的方法

    获取选中select : $("#id option:selected").val(); 自定义radio: $("input[name=sex][value="+data.sex+"]").attr("checked",true); 获取radio: $("input[name='sex']:checked").val() 设置input不能编辑: $("#cashNum").attr

  • jQuery获得内容和属性示例代码

    获得内容 - text().html() 以及 val() 三个简单实用的用于 DOM 操作的 jQuery 方法: text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元素的内容(包括 HTML 标记) val() - 设置或返回表单字段的值 获取属性 - attr() jQuery attr() 方法用于获取属性值. 下面的例子演示如何获得链接中 href 属性的值: 实例 复制代码 代码如下: $("button").click(function(){

  • 使用jQuery获得内容以及内容的属性

    复制代码 代码如下: <!DOCTYPE html> <html>     <head>         <meta charset="utf-8">         <title></title>         <script src="js/jquery.js"></script>     </head> <style> body{font-

  • 详解jQuery设置内容和属性

    一.设置内容以及回调函数 方法 text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元素的内容(包括 HTML 标记) val() - 设置或返回表单字段的值 例子 $("#btn1").click(function(){ $("#test1").text("Hello world!"); });//设置文本内容 $("#btn2").click(function(){ $("#test2

  • jQuery 获取对象 根据属性、内容匹配, 还有表单元素匹配

    指定元素中包含 id 属性的, 如: $("span[id]") 复制代码 代码如下: <span id="span1" name="S1">AAA</span><br/> <span id="span2" name="S2">BBB</span><br/> <span name="Sx3">CCC<

  • 详解jQuery获取特殊属性的值以及设置内容

    jQuery特殊属性方法 val方法 val方法适用于设置和获取表单元素的值,例如input.textarea的值 //获取name的值 $("#name").val(""); //设置name的值 $("#name").val("张三"); html方法 html方法相当于innerHTML,会识别html标签 //获取内容的值$("div").html("<span>今天天气真好&

  • JQuery获得内容和属性方法解析

    jQuery 拥有可操作 HTML 元素和属性的强大方法. jQuery DOM 操作 jQuery 中非常重要的部分,就是操作 DOM 的能力. jQuery 提供一系列与 DOM 相关的方法,这使访问和操作元素和属性变得很容易. 提示:DOM = Document Object Model(文档对象模型) DOM 定义访问 HTML 和 XML 文档的标准: "W3C 文档对象模型独立于平台和语言的界面,允许程序和脚本动态访问和更新文档的内容.结构以及样式." 获得内容 - tex

  • pyqt5 lineEdit设置密码隐藏,删除lineEdit已输入的内容等属性方法

    self.lineEdit.setEchoMode(QLineEdit.Password) 设置密码隐藏 self.lineEdit.setClearButtonEnabled(True) 设置对输入内容的删除提示 self.lineEidt.setFixedSize() 总的设置控件大小 self.lineEdit.setFixedWidth() 设置宽度 self.lineEdit.setFixedHeight() 设置高度 self.lineEidt.setFrame(False) 设置无

  • JavaScript或jQuery 获取option value值方法解析

    1.html <div class="form-group"> <label>保险公司</label> <select class="form-control" id="testSelect"> <option value="平安">平安保险</option> <option value="太平洋">太平洋保险</op

  • Python类及获取对象属性方法解析

    1.类外面添加对象属性 class Washer(): def wash(self): print('do some laundry stuff') haier1 = Washer() #添加属性,对象名.属性名 = 值 haier1.width = 400 haier1.height = 500 对象属性既可以在类外面添加和获取,也可以在类里面添加和获取 在类外面获取对象属性: 在上方代码上添加: print(f'洗衣机宽度为{haier1.width}') print(f'洗衣机高度为{ha

  • jQuery HTML设置内容和属性操作实例分析

    目录 jQuery-设置内容和属性 设置内容-text().html()以及val() text().html()以及val()的回调函数 设置属性-attr() attr()的回调函数 本文实例讲述了jQuery HTML设置内容和属性操作.分享给大家供大家参考,具体如下: jQuery - 设置内容和属性 设置内容 - text().html() 以及 val() 将使用前一章中的三个相同的方法来设置内容: text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元素

  • jQuery使用ajax方法解析返回的json数据功能示例

    本文实例讲述了jQuery使用ajax方法解析返回的json数据功能.分享给大家供大家参考,具体如下: 最近在用jQuery的ajax方法传递接收json数据时发现一个问题,那就是返回的data数据,有时候可以直接作为json数据使用,可有时候又不行.查了些资料,解释如下: $.ajax({ url: ajaxurl, type: "POST", success: function(data){ //假设返回的json数据里有status及info2个属性 //有时候可以直接ajaxo

  • jQuery事件对象的属性和方法详解

    jQuery事件对象的属性和方法详解

    jQuery事件对象的属性和方法,供大家参考,具体内容如下 事件对象的属于与方法有很多,但是我们经常用的只有那么几个,这里我主要说下作用与区别 event.type:获取事件的类型 触发元素的事件类型 $("a").click(function(event) { alert(event.type); // "click"事件 }); event.pageX 和 event.pageY:获取鼠标当前相对于页面的坐标 通过这2个属性,可以确定元素在当前页面的坐标值,鼠标

随机推荐