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 相关文章推荐
利用JQuery为搜索栏增加tag提示
Jun 22 Javascript
根据选择不同的下拉值出现相对应的文本输入框
Aug 01 Javascript
CSS鼠标响应事件经过、移动、点击示例介绍
Sep 04 Javascript
使用Raygun来自动追踪AngularJS中的异常
Jun 23 Javascript
angularjs学习笔记之三大模块(modal,controller,view)
Sep 26 Javascript
浅谈JavaScript中小数和大整数的精度丢失
May 31 Javascript
jQuery ajax应用总结
Jun 02 Javascript
JS请求servlet功能示例
Jun 01 Javascript
JavaScript函数绑定用法实例分析
Nov 14 Javascript
详解JS模块导入导出
Dec 20 Javascript
jQuery zTree树插件的使用教程
Aug 16 jQuery
Node.js API详解之 dns模块用法实例分析
May 15 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
DC这些乐高系列动画电影你看过几部?
2020/04/09 欧美动漫
用PHP连接MySQL代码的参数说明
2008/06/07 PHP
mysql总结之explain
2012/02/27 PHP
Thinkphp3.2.3分页使用实例解析
2016/07/28 PHP
完美解决php 导出excle的.csv格式的数据时乱码问题
2017/02/18 PHP
thinkPHP5框架设置404、403等http状态页面的方法
2018/06/05 PHP
PHP中用Trait封装单例模式的实现
2019/12/18 PHP
基于PHP实现堆排序原理及实例详解
2020/06/19 PHP
jQuery中fadeIn、fadeOut、fadeTo的使用方法(图片显示与隐藏)
2013/05/08 Javascript
纯js简单日历实现代码
2013/10/05 Javascript
IE下Ajax缓存问题的快速解决方法(get方式)
2014/01/09 Javascript
js实现点击切换TAB标签实例
2015/08/21 Javascript
JavaScript中字符串与Unicode编码互相转换的实现方法
2015/12/18 Javascript
AngularJS手动表单验证
2016/02/01 Javascript
React.js入门实例教程之创建hello world 的5种方式
2016/05/11 Javascript
jQuery中deferred对象使用方法详解
2016/07/14 Javascript
AngularJs ng-route路由详解及实例代码
2016/09/14 Javascript
ThinkJS中如何使用MongoDB的CURD操作
2016/12/13 Javascript
在一个页面重复使用一个js函数的方法详解
2016/12/26 Javascript
JS中的三个循环小结
2017/06/20 Javascript
JavaScript实现简单生成随机颜色的方法
2017/09/21 Javascript
详解微信小程序之一键复制到剪切板
2019/04/24 Javascript
vue指令v-html使用过滤器filters功能实例
2019/10/25 Javascript
通过javascript实现扫雷游戏代码实例
2020/02/09 Javascript
Python爬取京东的商品分类与链接
2016/08/26 Python
Python正则表达式教程之二:捕获篇
2017/03/02 Python
Anaconda 离线安装 python 包的操作方法
2018/06/11 Python
Python图像滤波处理操作示例【基于ImageFilter类】
2019/01/03 Python
python 发送json数据操作实例分析
2019/10/15 Python
Python3 使用map()批量的转换数据类型,如str转float的实现
2019/11/29 Python
python 字符串格式化的示例
2020/09/21 Python
CSS3动画效果回调处理详解
2014/12/10 HTML / CSS
台湾菁英交友:结识黄金单身的台湾人
2018/01/22 全球购物
秋季校运会广播稿100字
2014/09/18 职场文书
单位员工收入证明样本
2014/10/09 职场文书
华山导游词
2015/02/03 职场文书