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


Posted in Javascript onOctober 30, 2014

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

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

jQuery.prop("outerHTML");

<div class="test"><p>hello,你好!</p></div>

<script>

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

</script>

输出结果为:<div class="test"><P>hello,你好!</p></div>

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

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

Javascript 相关文章推荐
JS 容错处理代码, 屏蔽错误信息
Mar 09 Javascript
JavaScript入门教程(3) js面向对象
Jan 31 Javascript
jQuery ajax BUG:object doesn't support this property or method
Jul 06 Javascript
jquery easyui combox一些实用的小方法
Dec 25 Javascript
jQuery中odd选择器的定义和用法
Dec 23 Javascript
DropDownList实现可输入可选择(两种版本可选)
Dec 07 Javascript
tablesorter.js表格排序使用方法(支持中文排序)
Feb 10 Javascript
JavaScript实现网页头部进度条刷新
Apr 16 Javascript
vue中设置、获取、删除cookie的方法
Sep 21 Javascript
小程序云开发获取不到数据库记录的解决方法
May 18 Javascript
package.json中homepage属性的作用详解
Mar 11 Javascript
解决微信授权成功后点击按返回键出现空白页和报错的问题
Jun 08 Javascript
如何调试异步加载页面里包含的js文件
Oct 30 #Javascript
fckeditor粘贴Word时弹出窗口取消的方法
Oct 30 #Javascript
js中style.display=&quot;&quot;无效的解决方法
Oct 30 #Javascript
Js实现网页键盘控制翻页的方法
Oct 30 #Javascript
javascript实现iframe框架延时加载的方法
Oct 30 #Javascript
js中iframe调用父页面的方法
Oct 30 #Javascript
js防止页面被iframe调用的方法
Oct 30 #Javascript
You might like
php下实现在指定目录搜索指定类型文件的函数
2008/10/03 PHP
PHP压缩html网页代码(清除空格,换行符,制表符,注释标记)
2012/04/02 PHP
使用cookie实现统计访问者登陆次数
2013/06/08 PHP
php制作文本式留言板
2015/03/18 PHP
基于ThinkPHP+uploadify+upload+PHPExcel 无刷新导入数据
2015/09/23 PHP
PHP设计模式概论【概念、分类、原则等】
2020/05/01 PHP
扩展jQuery 键盘事件的几个基本方法
2009/10/30 Javascript
模拟jQuery ajax服务器端与客户端通信的代码
2011/03/28 Javascript
js动态加载以及确定加载完成的代码
2011/07/31 Javascript
JavaScript自动设置IFrame高度的小例子
2013/06/08 Javascript
Jquery 动态生成表格示例代码
2013/12/24 Javascript
深入探讨javascript中的数据类型
2015/03/04 Javascript
jQuery的css() 方法使用指南
2015/05/03 Javascript
Jquery ajax 同步阻塞引起的UI线程阻塞问题
2015/11/17 Javascript
jQuery随手笔记之常用的jQuery操作DOM事件
2015/11/29 Javascript
简单实现AngularJS轮播图效果
2020/04/10 Javascript
JS判断Android、iOS或浏览器的多种方法(四种方法)
2017/06/29 Javascript
vue2.0设置proxyTable使用axios进行跨域请求的方法
2017/10/19 Javascript
JavaScript实现数组全排列、去重及求最大值算法示例
2018/07/30 Javascript
Vue Components 数字键盘的实现
2019/09/18 Javascript
js实现简单掷骰子小游戏
2019/10/24 Javascript
[02:51]DOTA2战队出征照拍摄花絮 TI3明星化身时尚男模
2013/07/22 DOTA
[58:42]DOTA2上海特级锦标赛C组败者赛 Newbee VS Archon第一局
2016/02/27 DOTA
python celery分布式任务队列的使用详解
2019/07/08 Python
基于python实现的百度新歌榜、热歌榜下载器(附代码)
2019/08/05 Python
TensorFlow实现checkpoint文件转换为pb文件
2020/02/10 Python
Python列表去重复项的N种方法(实例代码)
2020/05/12 Python
使用Keras构造简单的CNN网络实例
2020/06/29 Python
把富文本的回车转为br标签
2019/08/09 HTML / CSS
HTML5自定义属性前缀data-及dataset的使用方法(html5 新特性)
2017/08/24 HTML / CSS
Farfetch台湾官网:奢侈品牌时尚购物平台
2019/06/17 全球购物
煤矿班组长的职责
2013/12/25 职场文书
2014年幼儿园后勤工作总结
2014/11/10 职场文书
教师先进事迹材料
2014/12/16 职场文书
python如何获取网络数据
2021/04/11 Python
Python如何使用循环结构和分支结构
2022/04/13 Python