jquery 获取 outerHtml 包含当前节点本身的代码

在开发过程中,jQuery.html() 是获取当前节点下的html代码,并不包含当前节点本身的代码,然后我们有时候确需要,找遍jQuery api文档也没有任何方法可以拿到。

看到有的人通过parent().html(),如果当前元素没有兄弟元素还行,如果有那就行不通了。后来实验发现有一个jQuery的一个方法可以解决,而且非常简便,如下:

jQuery.prop("outerHTML");

复制代码 代码如下:

hello,你好!

$(".test").prop("outerHTML");

输出结果为:

hello,你好!

因为原生JS DOM里有一个内置属性 outerHTML (看清大小写哦,JS是区分大小写的)用来获取当前节点的html代码(包含当前节点),所以用jQuery的prop()能拿到,经过实验attr()方法是拿不到的,不信的话,大家也可以尝试尝试,谢谢。

当然也有人用jQuery的 clone() 函数配合append() 来创建一个只有一个子元素的节点,然后来拿节点的html,这样也是可行的,但是代码繁琐。

时间: 2014-10-27

如果文档中某一个元素多余,那么应将其删除.jQuery提供了两种删除节点的方法,remove()方法和empty()方法. 1. remove():

jQuery.parent(expr) 找父亲节点,可以传入expr进行过滤,比如$("span").parent()或者$("span").parent(".class") jQuery.parents(expr),类似于jQuery.parents(expr),但是是查找所有祖先元素,不限于父元素 jQuery.children(expr).返回所有子节点,这个方法只会返回直接的孩子节点,不会返回所有的子孙节点 jQuery.contents

HTML 复制代码 代码如下:

JsBin-在线js/css调试工具&

在jquery中val,text,html都能取到值,或加一个参数来赋值,那么它们有些什么区别?下面我们来举例说明: 首先,html属性中有两个方法,一个有参,一个无参 1. 无参html():取得第一个匹配元素的html内容.这个函数不能用于XML文档.但可以用于XHTML文档,返回的是一个String 例子: html页面代码:

Hello

jquery代码:$("div").html(); 结果:H

jQuery获取Select选择的Text和Value: 复制代码 代码如下: var checkText=jQuery("#select_id").find("option:selected").text(); //获取Select选择的Text var checkValue=jQuery("#select_id").val(); //获取Select选择的option Value var checkIndex=jQuery("#se

通常我们会遇到选中某个条件,然后添加,累计多个后,再进行执行. 废话不多说,直接上代码! 复制代码 代码如下:

Jquery动态添加及删除页面节点

获取节点纯文本: var text = $('#text_test').text() 这个会得到"test text techbrood co.",也就

本文实例讲述了JQuery查找DOM节点的方法.分享给大家供大家参考.具体分析如下: DOM操作是JQuery最常见的用法,下面我们来将JQuery的DOM操作逐个剖析下.先来最简单的查找节点操作. 为了能全面地讲解DOM操作,首先需要构建一个网页.因为每一张网页都能用DOM表示出来,而每一份DOM都可以看作一棵DOM树.HTML代码如下:

欢迎访问我们

本文章简单的介绍了关于jQuery移动和复制dom节点程序实现,有需要学习的朋友可参考参考. 在做一个项目时,需要dom节点移动,如以下代码: 复制代码 代码如下:

需要把p标签移动到div标签里,经过测试发现,在jQuery中移动dom节点非常方便: 复制代码 代码如下: $('div').append($('p')) 这样即可把p标签移动到div标签里,千万不要写成这样: 复制代码 代码如下: $('div').a

本文实例讲述了原生js实现针对Dom节点的CRUD操作.分享给大家供大家参考,具体如下: 知识点,依然会遗忘.我在思考到底是什么原因.想到研究生考试准备的那段岁月,想到知识体系的建立,知识体系分为正向知识体系和逆向知识体系:正向知识体系可以理解为教科书目录,逆向知识体系可以理解考试真题. 按照知识体系建设这个思路,追求长久的深刻的记忆.决定建立正向知识体系.本文系正向知识体系的第一篇. 原生js操作dom节点:所谓的CRUD,代表create,read,update,del:也就是创建,读取,更

HTML DOM 树 一.DOM简介 DOM是W3C制定的用于访问诸如XML和XHTML等结构化文档的标准. W3C文档对象模型(DOM)是一个使程序和脚本有能力动态地访问和更新文档的内容.结构以及样式的平台和语言中立的接口 核心DOM:用于任何结构化文档的标准模型 XML DOM:用于XML文档的标准模型.是用于获取.更改.添加或删除XML元素的标准. HTML DOM: 用于HTML文档的标准模型.定义了所有HTML元素的对象和属性,以及访问它们的方法(接口). 二.DOM节点 根据DOM规

本文实例讲述了JQuery复制DOM节点的方法.分享给大家供大家参考.具体分析如下: 复制节点也是常用的DOM操作之一,例如很多购物网站的效果,用户不仅可以通过单击商品下方的"选择"按钮购买相应的产品,也可以通过鼠标拖动商品并将其放到购物车中.这个商品拖动功能就是用的复制节点,将用户选择的商品所处的节点元素复制一次,并将其跟随鼠标移动,从而达到购物效果. HTML DOM结构如下:

//

网上找了份jquery的操作节点方法清单.如下: 方法 源包装集/字串 目标包装集体 特性描述 A.append(B) B A 若目标包装集只匹配一个元素,则源(也包括同源包装集匹配的所有元素)将被移动到目标位置:若目标包装集包含多个元素,则源将保留在原来的位置,但同时复制一份相同的副本到目标位置. 由此,若目标只匹配一个元素时,使用前述方法后源将被删除. B.appendTo(A) A.prepend(B) B.prependTo(A) A.before(B) B.insertBefore(A

本文实例讲述了JQuery包裹DOM节点的方法.分享给大家供大家参考.具体分析如下: 如果要将某个节点用其他标记包裹起来,JQuery提供了相应的方法,即wrap(),该方法对于需要在文档中插入额外的结构化标记非常有用,而且它不会破坏原始文档的语义. wrap() 复制代码 代码如下: $("#li_1").wrap(""); 得到的结果如下:

本文实例分析了jQuery遍历DOM节点操作之filter()方法.分享给大家供大家参考,具体如下: .filter(selector) 此方法用于在匹配元素中按照选择器表达式进行筛选. 记住:使用此方法必须得传入选择器表达式参数,不然会报错"'nodeType' 为空或不是对象" 另外请注意这个filter方法和jquery中的find方法的区别: filter方法是对匹配元素进行筛选,而find方法是对匹配元素的后代元素进行筛选. 从jquery1.4版本开始,filter方法又添

jquery html包含自身,jquery 获取 outerHtml 包含当前节点本身的代码相关推荐

  1. jquery 获取 outerHtml 包含当前节点本身的代码

    在开发过程中,jQuery.html() 是获取当前节点下的html代码,并不包含当前节点本身的代码,然后我们有时候确需要,找遍jQuery api文档也没有任何方法可以拿到. 看到有的人通过pare ...

  2. jquery兄弟标签_jquery如何获取某一个兄弟节点,不是全部的,是指定的兄弟节点...

    展开全部 $('#id').siblings() 当前元素62616964757a686964616fe59b9ee7ad9431333366303838所有的兄弟节点 $('#id').prev() ...

  3. jsquery获取页面元素的html代码,【jQuery 使用】 利用jQuery.prop(outerHTML)获取包含自身在内的HTML元素的HTML代码...

    jQuery.html() 是获取当前节点下的html代码,并不包含当前节点本身的代码,然而我们有时候的确需要,可以通过jQuery.prop("outerHTML")的方式设置. ...

  4. js ajax获得对象怎么放到td上,jquery通过AJAX从后台获取信息并显示在表格上,并支持行选中...

    不想用Easyui的样式,但是想要他的表格功能,本来一开始是要到网上找相关插件的,但是没找到就开始自己写,没想到这么简单. 后台代码:(这个不重要) public ActionResult GetDi ...

  5. 利用jquery写的从后台获取json数据以表格显示,并带翻页功能.里面包含模式窗口等功能...

    利用jquery写的从后台获取json数据,以表格显示,并带翻页功能 里面包含模式窗口等功能 大家看例子就懂了 下面是效果图: http://www.jm47.com/project/3001.asp ...

  6. html 获取下一个兄弟节点,JS/JQuery获取当前元素的上一个/下一个兄弟级元素等元素的方法...

    $(function(){ //遍历获取的input元素对象数组,绑定click事件 var len = $("input[type='file']").length; for(v ...

  7. 【转】Jquery -Ajax 入门练习 Jquery.Ajax 调用后台函数,获取DataTable Json,Asp.net

    直接上图=============最后拷贝源码(图片清楚) ====================================================================== ...

  8. 用JQuery中的Ajax方法获取web service等后台程序中的方法

    用JQuery中的Ajax方法获取web service等后台程序中的方法 1.准备需要被前台html页面调用的web Service,这里我们就用ws来代替了,代码如下: using System; ...

  9. jquery兄弟标签_js jquery获取当前元素的兄弟级 上一个 下一个元素

    var chils= s.childNodes;  //得到s的全部子节点 var par=s.parentNode;   //得到s的父节点 var ns=s.nextSbiling;   //获得 ...

  10. JQuery URL的GET参数值获取方法

    // jQuery url get parameters function [获取URL的GET参数值] // <code> // var GET = $.urlGet(); //获取UR ...

最新文章

  1. php源码编译常见错误解决方案大全
  2. grep -R 关键字 目录
  3. devops的公开课
  4. Hadoop - UDF
  5. Android学习笔记36:使用SQLite方式存储数据
  6. 高级系统项目管理师笔记1
  7. 谁才是2019最火爆的编程语言,看这篇就够了
  8. 资深架构专家聊架构之道:规划、简化和演化(续)
  9. 利用Linux命令和perl脚本批量将文件重命名
  10. 财富反而越增涨,越没钱的人,财富越下降
  11. ssh整合(spring + struts2 + hibernate)xml版
  12. 思科网络设备命令大全
  13. 移动端人脸识别活体检测,高效集成
  14. php实现把二叉树打印成多行(谋而后动,写好算法思路,不然浪费超多时间而且还是错误代码,而且精力消耗会导致代码正确率下降以及低级错误)...
  15. 网络安全课第九节 网络安全攻防实战
  16. pytroch、tensorflow对比学习—功能组件(数据管道、回调函数、特征列处理)
  17. 短视频后期要做哪些内容?注意细节才能做出优质短视频
  18. 微信小程序 表情小作坊 — 轻松定制表情包 1
  19. dock接口_回看手机接口发展史:TypeC将实现大一统?
  20. $http的使用方式

热门文章

  1. batchplot插件用法_batchplot批量打印怎么用?Batchplot(CAD批量打印工具)安装步骤
  2. STM8S 红外解码+低功耗处理
  3. Flash CS6 新功能
  4. SSIS(简单数据抽取过程介绍)
  5. 摩托罗拉E2卸载MPKG程序的简单方法
  6. centos7 pe系统安装_u盘pe修复系统引导u盘安装centos7 无法开机
  7. libfetion的使用
  8. 使用GoodSync备份服务器文件
  9. CS269I:Incentives in Computer Science 学习笔记 Lecture 20: Fair Division(公平分配)(本系列完结撒花!)
  10. MATLAB随机数的应用ppt,Matlab生成随机数.ppt