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

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

DOM--文档对象模型。

 <!DOCTYPE html>

 <html>

 <head>

 <meta charset="utf-8">

 <script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>

 <script type="text/javascript">

     $(function(){

         $("#btn1").click(function(){

             alert("Text:"+$("#test").text());

         })

         $("#btn2").click(function(){

             alert("HTML:"+$("#test").html());

         })

         $("#btn3").click(function(){

             alert("值:"+$("#test2").val());

         })

         $("#btn4").click(function(){

             alert("href值:"+$("#a1").attr("href"));

         })

     })

 </script>

 </head>

 <body>

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

     <p>名称：<input type="text" id="test2" value="你我他学习吧" /></p>

     <p><a href="www.nwtxxb.com" id="a1">你我他学习吧</a></p>

     <button id="btn4">显示href属性的值</button>

     <button id="btn3">显示值value</button>

     <button id="btn1">显示文本</button>

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

 </body>

 </html>

【学亮IT手记】jQuery DOM操作-获取内容和属性的更多相关文章

  1. JQuery DOM操作（属性操作/样式操作/文档过滤）

    jQuery——入门(三)JQuery DOM操作(属性操作/样式操作/文档过滤) 一.DOM属性操作 1.属性 (1).attr() 方法 语法:$(selector).attr(name|prop ...

  2. jQuery DOM操作之结点转移复制

    jQuery DOM操作之结点转移复制 $('div').append($('p'))这样即可把p标签移动到div标签里 $('div').append( $('p').html() )是把p标签里的 ...

  3. jQuery - 获取内容和属性

    jQuery 拥有可操作 HTML 元素和属性的强大方法. jQuery DOM 操作 jQuery 中非常重要的部分,就是操作 DOM 的能力. jQuery 提供一系列与 DOM 相关的方法,这使 ...

  4. jquery获取内容和属性的方法

    通过jquery如何捕获文本内容和属性? text(),html(),val()及attr(). attr()更具有普遍性,元素text属性和表单value属性,可以通过attr()操作. <! ...

  5. jquery尺寸和jQuery设置和获取内容方法

    一.jquery尺寸 jQuery 提供多个处理尺寸的重要方法: width()    设置或返回元素的宽度(不包括内边距.边框或外边距),括号中可填数值宽度参数,无单位 height()   设置或 ...

  6. 【学亮IT手记】jQuery each()函数用法实例

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script sr ...

  7. JQuery -- Dom操作， 示例代码

    1.内部插入节点 *   append(content) :向每个匹配的元素的内部的结尾处追加内容 *   appendTo(content) :将每个匹配的元素追加到指定的元素中的内部结尾处 *   ...

  8. JQuery dom 操作总结

    DOM 操作之获取值 获得内容 - text():设置或返回所选元素的文本内容 $("#btn1").click(function(){ alert("Text: &qu ...

  9. Jquery DOM 操作列表

    jQuery 文档操作方法 这些方法对于 XML 文档和 HTML 文档均是适用的,除了:html(). jQuery 属性操作方法 下面列出的这些方法获得或设置元素的 DOM 属性. 这些方法对于 ...

随机推荐

  1. line-height

    如何实现左右两边有小竖线,但是高度比中间的字短? 用line-height,把line-height设置得跟height一样大,同时把font-size设置比line-height大即可

  2. ElasticSearch（六）：安装中文分词器插件smartcn

    首先进入elasticsearch的bin目录 然后执行 #  sh elasticsearch-plugin install analysis-smartcn 安装完成后,需要重启elasticse ...

  3. Druid、BoneCP、DBCP、C3P0等主流数据库对比

    关键功能 Druid BoneCP DBCP C3P0 Proxool JBoss LRU 是 否 是 否 是 是 PSCache 是 是 是 是 否 是 PSCache-Oracle-Optimiz ...

  4. 002_浅析python 中__name__ = '__main__' 的作用

    很多新手刚开始学习python的时候经常会看到python 中__name__ = \'__main__\' 这样的代码,可能很多新手一开始学习的时候都比较疑惑,python 中__name__ = ...

  5. Dubbo -- 系统学习 笔记 -- 示例 -- 参数验证

    示例 想完整的运行起来,请参见:快速启动,这里只列出各种场景的配置方式 参数验证 参数验证功能是基于JSR303实现的,用户只需标识JSR303标准的验证Annotation,并通过声明filter来 ...

  6. 20175330 实验一 《Java开发环境的熟悉》实验报告

    一.实验内容及步骤 (一)使用JDk编译.运行简单的Java程序 (一)使用JDk编译.运行简单的Java程序 输入cd Code命令进入Code目录 输入mkdir 20175308建立实验目录 l ...

  7. Linux并发与同步专题 (1)原子操作和内存屏障

    关键词:. <Linux并发与同步专题 (1)原子操作和内存屏障> <Linux并发与同步专题 (2)spinlock> <Linux并发与同步专题 (3) 信号量> ...

  8. mongodb java3.2驱动 测试 一些记录

    mongo驱动包 自带线程池的概念 获取 MongoClient mongoClient 后 通过客户端(mongoClient ) 获取 库操作 MongoDatabase 获取 表操作 Mongo ...

  9. Linux或Windows上实现端口映射

    通常服务器会有许多块网卡,因此也可能会连接到不同的网络,在隔离的网络中,某些服务可能会需要进行通信,此时服务器经过配置就可以承担起了转发数据包的功能. 一.Windows下实现端口映射 1. 查询端口 ...

  10. 朱晔和你聊Spring系列S1E1：聊聊Spring家族的几大件

    朱晔和你聊Spring系列S1E1:聊聊Spring家族的几大件 [下载本文PDF进行阅读] Spring家族很庞大,从最早先出现的服务于企业级程序开发的Core.安全方面的Security.到后来的 ...