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获取宽高与jquery获取宽高的方法关系对比
Apr 04 Javascript
完美兼容各大浏览器的jQuery插件实现图片切换特效
Dec 12 Javascript
jQuery实现文本展开收缩特效
Jun 03 Javascript
JS基础随笔(菜鸟必看篇)
Jul 13 Javascript
原生js仿jquery一些常用方法(必看篇)
Sep 20 Javascript
js实现随机点名小功能
Aug 17 Javascript
vue-resource拦截器设置头信息的实例
Oct 27 Javascript
Vue 项目代理设置的优化
Apr 17 Javascript
JS实现的排列组合算法示例
Jul 16 Javascript
json 带斜杠时如何解析的实现
Aug 12 Javascript
Vue中使用matomo进行访问流量统计的实现
Nov 05 Javascript
vue中watch和computed的区别与使用方法
Aug 23 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 文件缓存的性能测试
2010/04/25 PHP
php array_pop()数组函数将数组最后一个单元弹出(出栈)
2011/07/12 PHP
php array_filter除去数组中的空字符元素
2020/06/21 PHP
php操作redis缓存方法分享
2015/06/03 PHP
Mootools 1.2教程 Tooltips
2009/09/15 Javascript
原生js写的放大镜效果
2012/08/22 Javascript
jquery实现图片裁剪思路及实现
2013/08/16 Javascript
JavaScript实现阿拉伯数字和中文数字互相转换
2016/06/12 Javascript
JS实现的多张图片轮流播放幻灯片效果
2016/07/22 Javascript
javascript封装addLoadEvent实现页面同时加载执行多个函数的方法
2016/07/25 Javascript
利用n 升级工具升级Node.js版本及在mac环境下的坑
2017/02/15 Javascript
微信小程序三级联动地址选择器的实例代码
2017/07/12 Javascript
Vue组件通信$attrs、$listeners实现原理解析
2020/09/03 Javascript
JavaScript 防抖和节流遇见的奇怪问题及解决
2020/11/20 Javascript
[03:17]史诗级大片应援2018DOTA2国际邀请赛 致敬每一位坚守遗迹的勇士
2018/07/20 DOTA
Python中List.index()方法的使用教程
2015/05/20 Python
详解python的ORM中Pony用法
2018/02/09 Python
在Python中将函数作为另一个函数的参数传入并调用的方法
2019/01/22 Python
Python动态赋值的陷阱知识点总结
2019/03/17 Python
django框架使用orm实现批量更新数据的方法
2019/06/21 Python
python使用mitmproxy抓取浏览器请求的方法
2019/07/02 Python
详解PyTorch手写数字识别(MNIST数据集)
2019/08/16 Python
python字典排序的方法
2019/10/12 Python
opencv之为图像添加边界的方法示例
2019/12/26 Python
解决python图像处理图像赋值后变为白色的问题
2020/06/04 Python
python 使用tkinter+you-get实现视频下载器
2020/11/17 Python
python模块内置属性概念及实例
2021/02/18 Python
德国富尔达运动鞋店:43einhalb
2020/12/25 全球购物
浪费资源的建议书
2014/03/12 职场文书
学校百日安全生产活动总结
2014/07/05 职场文书
某集团股份有限公司委托书样本
2014/09/24 职场文书
死亡赔偿协议书
2015/01/28 职场文书
《童年的发现》教学反思
2016/02/18 职场文书
详解Python中的进程和线程
2021/06/23 Python
PostgreSQL并行计算算法及参数强制并行度设置方法
2022/04/06 PostgreSQL
Golang 链表的学习和使用
2022/04/19 Golang