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 关键词高亮(根据ID/tag高亮关键字)案例介绍
Jan 21 Javascript
javascript判断是否按回车键并解决浏览器之间的差异
May 13 Javascript
Javascript前端UI框架Kit使用指南之kitjs的对话框组件
Nov 28 Javascript
javascript限制文本框输入值类型的方法
May 07 Javascript
js实现顶部可折叠的菜单工具栏效果实例
May 09 Javascript
JS获取input file绝对路径的方法(推荐)
Aug 02 Javascript
实战node静态文件服务器的示例代码
Mar 08 Javascript
node中modules.exports与exports导出的区别
Jun 08 Javascript
jQuery Ajax实现Select多级关联动态绑定数据的实例代码
Oct 26 jQuery
vue-cli或vue项目利用HBuilder打包成移动端app操作
Jul 29 Javascript
基于JavaScript实现简单的轮播图
Mar 03 Javascript
详解JavaScript中的执行上下文及调用堆栈
Apr 29 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面向对象
2012/02/22 PHP
PHP遍历目录函数opendir()、readdir()、closedir()、rewinddir()总结
2014/11/18 PHP
PHP批量查询WordPress留言者E-mail地址实现方法
2015/02/15 PHP
js面向对象 多种创建对象方法小结
2012/05/21 Javascript
javascript中处理时间戳为日期格式的方法
2014/01/02 Javascript
javascript抽象工厂模式详细说明
2014/12/16 Javascript
详解JavaScript的回调函数
2015/11/20 Javascript
javascript闭包(Closure)用法实例简析
2015/11/30 Javascript
vue-router跳转页面的方法
2017/02/09 Javascript
详解PHP后期静态绑定分析与应用
2018/03/21 Javascript
vue中$refs的用法及作用详解
2018/04/24 Javascript
vue cli 3.x 项目部署到 github pages的方法
2019/04/17 Javascript
Node.js实现一个HTTP服务器的方法示例
2019/05/13 Javascript
JavaScript中this函数使用实例解析
2020/02/21 Javascript
python调用Moxa PCOMM Lite通过串口Ymodem协议实现发送文件
2014/08/15 Python
进一步探究Python中的正则表达式
2015/04/28 Python
OpenCV HSV颜色识别及HSV基本颜色分量范围
2019/03/22 Python
Python如何通过Flask-Mail发送电子邮件
2020/01/29 Python
Anconda环境下Vscode安装Python的方法详解
2020/03/29 Python
Python中的全局变量如何理解
2020/06/04 Python
Python是怎样处理json模块的
2020/07/16 Python
在PyCharm中安装PaddlePaddle的方法
2021/02/05 Python
使用CSS3代码绘制可爱的Hello Kitty猫
2016/08/03 HTML / CSS
英国独特的时尚和生活方式品牌:JOY
2018/03/17 全球购物
美国50岁以上单身人士约会平台:SilverSingles
2018/06/29 全球购物
应届毕业生就业自荐信
2013/10/26 职场文书
寒假实习自荐信
2014/01/26 职场文书
销售经理工作职责
2014/02/03 职场文书
计算机专业自荐信范文
2014/05/28 职场文书
垃圾桶标语
2014/06/24 职场文书
终止劳动合同协议书
2014/10/05 职场文书
2015小学语文教师个人工作总结
2015/05/20 职场文书
聘任书格式及范文
2015/09/21 职场文书
四年级作文之植物
2019/09/20 职场文书
Python基础教程,Python入门教程(超详细)
2021/06/24 Python
新手初学Java网络编程
2021/07/07 Java/Android