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 相关文章推荐
动态载入/删除/更新外部 JavaScript/Css 文件的代码
Jul 03 Javascript
各浏览器对link标签onload/onreadystatechange事件支持的差异分析
Apr 27 Javascript
Extjs中的GridPanel隐藏列会显示在menuDisabled中解决方法
Jan 27 Javascript
JavaScript拆分字符串时产生空字符的解决方案
Sep 26 Javascript
JavaScript中计算网页中某个元素的位置
Jun 10 Javascript
一种基于浏览器的自动小票机打印实现方案(js版)
Jul 26 Javascript
原生JS中slice()方法和splice()区别
Mar 06 Javascript
JavaScript 过滤关键字
Mar 20 Javascript
Vue组件库发布到npm详解
Feb 17 Javascript
Vue组件开发技巧总结
Mar 04 Javascript
继承行为在 ES5 与 ES6 中的区别详解
Dec 24 Javascript
原生js拖拽功能制作滑动条实例代码
Feb 05 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正则验证Email的方法
2015/06/15 PHP
PHP中key和current,next的联合运用实例分析
2016/03/29 PHP
Ajax请求PHP后台接口返回信息的实例代码
2018/08/21 PHP
PHP+jQuery实现双击修改table表格功能示例
2019/02/21 PHP
javascript编程起步(第五课)
2007/01/10 Javascript
非常强大的 jQuery.AsyncBox 弹出对话框插件
2011/08/29 Javascript
10款非常有用的 Ajax 插件分享
2012/03/14 Javascript
javascript获取下拉列表框当中的文本值示例代码
2013/07/31 Javascript
javascript实现信息的显示和隐藏如注册页面
2013/12/03 Javascript
js判断上传文件类型判断FileUpload文件类型代码
2014/05/20 Javascript
jQuery实现的五子棋游戏实例
2015/06/13 Javascript
jQuery表单插件ajaxForm实例详解
2017/01/17 Javascript
Vue.js render方法使用详解
2017/04/05 Javascript
AngularJS基于factory创建自定义服务的方法详解
2017/05/25 Javascript
vue-router项目实战总结篇
2018/02/11 Javascript
Vue CLI3 如何支持less的方法示例
2018/08/29 Javascript
VUE:vuex 用户登录信息的数据写入与获取方式
2019/11/11 Javascript
js绘制一条直线并旋转45度
2020/08/21 Javascript
vue动态设置页面title的方法实例
2020/08/23 Javascript
如何在vue 中使用柱状图 并自修改配置
2021/01/21 Vue.js
Python实现批量将word转html并将html内容发布至网站的方法
2015/07/14 Python
python+matplotlib绘制旋转椭圆实例代码
2018/01/12 Python
Django中的Signal代码详解
2018/02/05 Python
Python爬虫基础之XPath语法与lxml库的用法详解
2018/09/13 Python
详解python 模拟豆瓣登录(豆瓣6.0)
2019/04/18 Python
详解用Python实现自动化监控远程服务器
2019/05/18 Python
下载与当前Chrome对应的chromedriver.exe(用于python+selenium)
2020/01/14 Python
tensorflow与numpy的版本兼容性问题的解决
2021/01/08 Python
MaBelle玛贝尔香港官网:香港钻饰连锁店
2019/09/09 全球购物
法国低价在线宠物商店:bitiba.fr
2020/07/03 全球购物
一名毕业生的自我鉴定
2013/12/04 职场文书
医学专业毕业生个人求职信
2013/12/25 职场文书
《一个小村庄的故事》教学反思
2014/04/13 职场文书
一体化教学实施方案
2014/05/10 职场文书
2014年科室工作总结
2014/11/20 职场文书
四大名著读书笔记
2015/06/25 职场文书