jquery获取及设置outerhtml的方法


Posted in Javascript onMarch 09, 2015

本文实例讲述了jquery获取及设置outerhtml的方法。分享给大家供大家参考。具体分析如下:

在开发过程中,jQuery.html() 是获取当前节点下的html代码,并不包含当前节点本身的代码,然而我们有时候的确需要,可以通过jQuery.prop("outerHTML")的方式设置。

很多jQuery的使用者都对这一问题深感疑惑。为什么在众多方便的各种获取属性和设置属性的方法中就不能像DOM中一样直接设置html元素的outerHTML呢?

因为原生JS DOM里有一个内置属性 outerHTML (看清大小写哦,JS是区分大小写的)用来获取当前节点的html代码(包含当前节点),所以用jQuery的prop()能拿到
 
一、jquery获取outerhtml

<div class="test"><p>hello,你好!</p></div>
<script>
$(".test").prop("outerHTML");
</script>

二、jquery设置outerhtml

$('.test').prop('outerHTML', '<input>');

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
JS中自定义定时器让它在某一时刻执行
Sep 02 Javascript
使用JQuery库提供的扩展功能实现自定义方法
Sep 09 Javascript
JQuery实现当鼠标停留在某区域3秒后自动执行
Sep 09 Javascript
javascript动态设置样式style实例分析
May 13 Javascript
jquery二级目录选中当前页的css样式
Dec 08 Javascript
Extjs 中的 Treepanel 实现菜单级联选中效果及实例代码
Aug 22 Javascript
vue2手机APP项目添加开屏广告或者闪屏广告
Nov 28 Javascript
Parcel.js + Vue 2.x 极速零配置打包体验教程
Dec 24 Javascript
使用mixins实现elementUI表单全局验证的解决方法
Apr 02 Javascript
Vue 权限控制的两种方法(路由验证)
Aug 16 Javascript
vue 路由meta 设置导航隐藏与显示功能的示例代码
Sep 04 Javascript
js实现Element中input组件的部分功能并封装成组件(实例代码)
Mar 02 Javascript
jQuery给动态添加的元素绑定事件的方法
Mar 09 #Javascript
jquery滚动加载数据的方法
Mar 09 #Javascript
jQuery晃动层特效实现方法
Mar 09 #Javascript
javascript中hasOwnProperty() 方法使用指南
Mar 09 #Javascript
jQuery设置和移除文本框默认值的方法
Mar 09 #Javascript
jQuery读取XML文件内容的方法
Mar 09 #Javascript
JQuery动态添加和删除表格行的方法
Mar 09 #Javascript
You might like
php SQL防注入代码集合
2008/04/25 PHP
PHP优于Node.js的五大理由分享
2012/09/15 PHP
基于PHP创建Cookie数组的详解
2013/07/03 PHP
destoon实现资讯信息前面调用它所属分类的方法
2014/07/15 PHP
PHP函数实现从一个文本字符串中提取关键字的方法
2015/07/01 PHP
PHP实现redis限制单ip、单用户的访问次数功能示例
2018/06/16 PHP
解决PHP curl或file_get_contents下载图片损坏或无法打开的问题
2019/10/11 PHP
基于JQuery.timer插件实现一个计时器
2010/04/25 Javascript
原生javascript获取元素样式属性值的方法
2010/12/25 Javascript
利用NodeJS和PhantomJS抓取网站页面信息以及网站截图
2013/11/18 NodeJs
javascript实用方法总结
2015/02/06 Javascript
JS实现弹性漂浮效果的广告代码
2015/09/02 Javascript
js实现可折叠展开的手风琴菜单效果
2015/09/07 Javascript
jQuery CSS3相结合实现时钟插件
2016/01/08 Javascript
Google 地图API Map()构造器详解
2016/08/06 Javascript
正则表达式,替换所有HTML标签的简单实例
2016/11/28 Javascript
canvas压缩图片转换成base64格式输出文件流
2017/03/09 Javascript
vue如何自动化打包测试环境和正式环境的dist/test文件
2019/06/06 Javascript
js prototype深入理解及应用实例分析
2019/11/25 Javascript
JS常见内存泄漏及解决方案解析
2020/05/30 Javascript
[49:42]DOTA2上海特级锦标赛主赛事日 - 3 胜者组第二轮#2Secret VS EG第一局
2016/03/04 DOTA
Python性能优化的20条建议
2014/10/25 Python
详解Python中find()方法的使用
2015/05/18 Python
python实现SMTP邮件发送功能
2020/06/16 Python
Python实现的rsa加密算法详解
2018/01/24 Python
解决pandas无法在pycharm中使用plot()方法显示图像的问题
2018/05/24 Python
Python自定义一个类实现字典dict功能的方法
2019/01/19 Python
python爬虫刷访问量 2019 7月
2019/08/01 Python
Django框架 Pagination分页实现代码实例
2019/09/04 Python
python使用正则表达式(Regular Expression)方法超详细
2019/12/30 Python
python获取响应某个字段值的3种实现方法
2020/04/30 Python
Matplotlib animation模块实现动态图
2021/02/25 Python
使用html2canvas.js实现页面截图并显示或上传的示例代码
2018/12/18 HTML / CSS
社团成立邀请函
2014/01/08 职场文书
和谐社区口号
2014/06/19 职场文书
2016年学习贯彻十八届五中全会精神心得体会
2016/01/05 职场文书