`
chenhongquan
  • 浏览: 44974 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

获取当前节点下的html代码

阅读更多

在开发过程中,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获取HTML DOM节点元素的方法的总结

    2. `neighbourNode.nextSibling`:获取当前节点的下一个兄弟节点。 在实际应用中,开发者通常会结合这些方法来定位和操作特定的DOM元素。例如,先通过`getElementById`找到一个父节点,然后使用`...

    AjaxTree源码,AJAX动态获取节点的子节点

    2. **DOM操作**:接收到服务器返回的子节点数据后,JavaScript会解析并动态创建新的HTML元素,然后将它们插入到当前节点下,完成节点的展开。 3. **数据格式处理**:通常,服务器返回的数据可能是JSON或XML格式。...

    jQuery步骤节点进度条代码

    `$('.step')`和`$('progress')`是jQuery选择器,用于获取HTML中的步骤节点和进度条元素。`.eq()`用于选取指定索引的元素,`.addClass()`和`.removeClass()`用来切换类名,`.val()`设置进度条的值。 总的来说,...

    文本框获取节点文本框获取节点

    - `element.nextSibling`和`element.previousSibling`:获取下一个或上一个兄弟节点。 - `element.firstChild`和`element.lastChild`:获取第一个或最后一个子节点。 - `element.childNodes`:获取所有子节点的...

    Activiti12流程跟踪任务节点和线高亮显示

    在流程跟踪任务节点和线高亮显示的实现中,我们首先需要获取流程实例ID,然后使用ProcessInstanceQuery获取流程实例对象。然后,我们使用HistoryService获取流程历史记录,包括流程走过的节点和线。接着,我们使用...

    练习2:访问当当购物车页面节点

    例如,如果购物车页面有一个特定的ID为"cart-items"的`&lt;div&gt;`元素,我们可以使用JavaScript的`document.getElementById()`方法获取这个节点: ```javascript var cartDiv = document.getElementById('cart-items');...

    Web前端开发技术-节点和节点的操作.pptx

    - **获取父级节点**:利用`parentNode`属性,可以获取到当前节点的直接父节点。例如,`child.parentNode`将返回`child`元素的父元素。 - **获取子级节点**:有两种方法: - `childNodes`属性返回一个包含所有子...

    jquery 获取 outerHtml 包含当前节点本身的代码

    标题《jquery 获取 outerHtml 包含当前节点本身的代码》与描述提到,在使用jQuery进行DOM操作时,`.html()`方法通常用于获取指定元素内部的HTML内容,但这个方法不包括元素本身的标签。有时开发者需要获取一个元素...

    动态添加树节点

    1. 编写一个SQL查询语句,根据当前节点的Value(即父节点ID)来获取其子节点。查询语句是`select *from myTree where parentId=@parentId`。 2. 创建一个SqlParameter数组,用于传递查询中的参数@parentId,将其...

    html 无限极组织结构前端代码

    HTML 无限极组织结构前端代码是一种用于展示层次关系数据的技术,常见于企业组织架构、文件系统或产品分类等场景。这种技术允许用户以树形结构查看数据,而且能够无限制地进行子节点的添加和扩展,提供了一种直观且...

    asp.net的Treeview的Checkbox选中父节点,选中全部子节点并且展开

    该方法首先获取当前被选中节点的所有子节点,并递归地设置它们的选中状态为与父节点相同的状态。同时,该方法还调用了 `ExpandAll()` 方法来展开当前被选中节点的所有子节点。 #### 四、HTML 结构示例 在 HTML ...

    jQuery插件zTree实现获取当前选中节点在同级节点中序号的方法

    本文实例讲述了jQuery插件zTree实现获取当前选中节点在同级节点中序号的方法。分享给大家供大家参考,具体如下: 1、实现代码: &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;zTree实现基本树&lt;/...

    如何正确地删除目录树中的节点

    通过`getCurrentModelObject()`方法可以获取到当前节点的信息,然后根据是否被选中来更改其样式。 #### 正确地删除树中的节点 在删除树中的节点时,我们需要注意以下几点: 1. **避免空指针异常**:在删除节点之后...

    对于xml节点的详细操作

    - **读取节点名称**:通过`Name`属性可以获取当前节点的名称。例如,如果当前节点是`&lt;city&gt;Chongqing&lt;/city&gt;`,那么`reader.Name`将返回`"city"`。 - **读取节点值**:通过`Value`属性可以获取当前节点的值。例如...

    jquery取子节点及当前节点属性值的方法

    在Web页面元素的管理和操作中,经常需要获取子节点或者当前节点的属性值。本文将详细介绍如何使用jQuery获取子节点以及当前节点的属性值。 首先,需要了解jQuery的语法和选择器。jQuery使用美元符号$()函数来选择...

    Js中节点的遍历和操作

    - `nextSibling`:获取当前节点的下一个兄弟节点。 - `previousSibling`:获取当前节点的上一个兄弟节点。 - `firstElementChild`:仅返回节点的第一个元素子节点,忽略文本节点。 - `lastElementChild`:仅返回...

    前端开发树节点PC端

    只加载当前可视区域的节点,当用户滚动或展开节点时,才加载更多的数据。这降低了初始渲染时间,提高了用户体验。 7. **无障碍性**:为了让所有用户都能访问,包括那些使用屏幕阅读器的用户,树节点需要遵循Web内容...

    技术节点数据结构代码

    在IT行业中,尤其是在Web开发领域,理解数据结构和代码的编写至关重要。本文将详细解析给定文件中的关键知识点,主要涉及C#编程语言以及Web应用开发中的路径处理、URL操作、正则表达式、数据操作及页面交互。 首先...

Global site tag (gtag.js) - Google Analytics