>>分享Web前端开发技术,并对孙卫琴的《精通Vue.js:Web前端开发技术详解》提供技术支持 书籍支持  卫琴直播  品书摘要  在线测试  资源下载  联系我们
发表一个新主题 开启一个新投票 回复文章 您是本文章第 26109 个阅读者 刷新本主题
 * 贴子主题:  jQuery 获取内容和属性 回复文章 点赞(0)  收藏  
作者:flybird    发表时间:2019-08-18 22:22:20     消息  查看  搜索  好友  邮件  复制  引用

  

jQuery -  获取内容和属性

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

jQuery DOM 操作

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

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

                                    
点击在新窗口中浏览原图
CTRL+鼠标滚轮放大或缩小 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 ( " 值为:  "  + $ ( " #test " ) . val ( ) ) ;
} ) ;

获取属性 - attr()

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

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

范例

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

程序猿的技术大观园:www.javathinker.net



[这个贴子最后由 flybird 在 2020-02-12 11:00:35 重新编辑]
  Java面向对象编程-->对象的生命周期
  JavaWeb开发-->JSP中使用JavaBean(Ⅱ)
  JSP与Hibernate开发-->数据库事务的概念和声明
  Java网络编程-->对象的序列化与反序列化
  精通Spring-->虚拟DOM和render()函数
  Vue3开发-->绑定CSS样式
  在Typescript脚本中使用axios
  JS 循环删除数组
  Vue.js学习笔记-基础部分+完整实现代码
  JavaScript中数组的常用方法(含ES6)
  史上最全的web前端面试题汇总及答案
  JavaScript 进制转换的实用代码
  jQuery 添加元素
  JavaScript的HTML DOM td / th 对象
  JavaScript Error(错误) 对象
  JavaScript Array 对象
  CSS 单位
  CSS3的响应式 Web 设计:媒体查询
  CSS3 多列布局
  JavaScript 调试
  JavaScript 输出数据
  更多...
 IPIP: 已设置保密
楼主      
1页 0条记录 当前第1
发表一个新主题 开启一个新投票 回复文章


中文版权所有: JavaThinker技术网站 Copyright 2016-2026 沪ICP备16029593号-2
荟萃Java程序员智慧的结晶,分享交流Java前沿技术。  联系我们
如有技术文章涉及侵权,请与本站管理员联系。