搜索
您的当前位置:首页正文

jQuery获取节点和子节点文本的方法_jquery

2023-12-04 来源:优库美食网

对于下面的html片段,

test texttechbrood co.

获取节点纯文本:

这个会得到“test text techbrood co.”,也就是会把当前元素的所有节点(包含子节点)的文本读取出来。

如果只想获取主节点的文本,方法复杂点:

获取某子节点的文本:

 

小编还为您整理了以下内容,可能对您也有帮助:

JQuery如何读取节点中的内容

JQuery提供以下两个方法可以读取节点中的内容:

    text() - 设置或返回所选元素的文本内容

    html() - 设置或返回所选元素的内容(包括 HTML 标记)

注意二者在获取内容上的区别,实例演示如下:

1、HTML结构

<div id="test"><i>示例文字</i></div>
<input type="button" id="btn1" value="获取text">
<input type="button" id="btn2" value="获取html">

2、jquery代码

$(function(){
$("#btn1").click(function() {
alert($("#test").text());
});
$("#btn2").click(function() {
alert($("#test").html());
});
});

3、效果演示

JQuery如何读取节点中的内容

JQuery提供以下两个方法可以读取节点中的内容:

    text() - 设置或返回所选元素的文本内容

    html() - 设置或返回所选元素的内容(包括 HTML 标记)

注意二者在获取内容上的区别,实例演示如下:

1、HTML结构

<div id="test"><i>示例文字</i></div>
<input type="button" id="btn1" value="获取text">
<input type="button" id="btn2" value="获取html">

2、jquery代码

$(function(){
$("#btn1").click(function() {
alert($("#test").text());
});
$("#btn2").click(function() {
alert($("#test").html());
});
});

3、效果演示

如何获取jquery easyui Tree的 (1)某一节点下的所有子节点,(2)某节点下的一级节点

//某一节点下的所有子节点

function getChildren(id/*节点ID*/){

    var $tree = $('#tree');

    var node = $tree.tree('find',id);

    var childrenNodes = $tree.tree('getChildren',node.target);

    return childrenNodes;

}

//某节点的一级节点

function getSubChildren(id){

    var $tree = $('#tree');

    var node = $tree.tree('find',id);

    var subNodes = [];

    $(node.target)

    .next().children().children("div.tree-node").each(function(){   

        subNodes.push($tree.tree('getNode',this));

    });

   return subNodes;

}

用jquery怎么取父节点的兄弟节点的所有子节点

jquery获取父元素方法比较多,比如parent(),parents(),closest(),find,first-child这些都能帮你实现查找父节点、子节点、兄弟节点。

$('#cur').parent().parent();或$('#cur').parent().parent('.pp');或$('#cur').parent('.pp');

jquery 兄弟节点的获取

<ul>

<li>

<h3 class="title">类目一</h3>

<ul>

<li>第一项</li>

<li>第二项</li>

</ul>

</li>

<li>

<h3 class="title">类目二</h3>

<ul>

<li>第一项</li>

<li>第二项</li>

</ul>

</li></ul>

比如要点击类目一所在的 h3,对其兄弟节点的 ul 添加一个叫做 "show" 的 class,代码如下:

$(".title").click(function () { $(this).parent().find('ul').addClass('show'); });

就是通过先找到 h3 与 ul 共同的父节点 li 然后来用 find() 找到 ul,还有一种方法是使用 siblings() 函数,代码如下:

(".title").click(function() { $(this).siblings('ul').addClass('show'); })

子节点怎么获得 .

$("#tbody1:first-child")

:first-child

匹配第一个子元素

':first' 只匹配一个元素,而此选择符将为每个父元素匹配一个子元素

优库美食网还为您提供以下相关内容希望对您有帮助:

JQuery如何读取节点中的内容

1、HTML结构 示例文字2、jquery代码 (function(){$("#btn1").click(function() {alert($("#test").text());});$("#btn2").click(function() {alert($("#test").html());});});3、效果演示 ...

jquery怎么获取当前标签下的子标签?

1、查找子元素方式1:&gt;\x0d\x0a例如:var aNods = $("ul &gt; a");查找ul下的所有a标签\x0d\x0a2、查找子元素方式2:children()\x0d\x0a3、查找子元素方式3:find()\x0d\x0a\x0d\x0a通过下标获取第...

jquery第一个子节点怎么获得

1、首先,打开html编辑器,新建html文件,例如:index.html,并引入jquery。2、在index.html中的标签,输入jquery代码:('body').append($('body').children(":first").text());3、浏览器运行index.html页面,此时成功...

jquery如何获取某一个兄弟节点,不是全部的,是指定的兄弟节点

('#id').siblings() 当前元素所有的兄弟节点$('#id').prev() 当前元素前一个兄弟节点$('#id').prevaAll() 当前元素之前所有的兄弟节点$('#id').next() 当前元素之后第一个兄弟节点$('#id').nextAll() 当前...

Jquery获取对象的几种方式介绍_jquery

1、JQuery的核心的一些方法 each(callback) '就像循环 $("Element").length; ‘元素的个数,是个属性 $("Element").size(); '也是元素的个数,不过带括号是个方法 $("Element").get(); ‘某个元素在页面中的...

用jquery怎么取父节点的兄弟节点的所有子节点

jquery获取父元素方法比较多,比如parent(),parents(),closest(),find,first-child这些都能帮你实现查找父节点、子节点、兄弟节点。('#cur').parent().parent();或$('#cur').parent().parent('.pp');或$('#cur...

jquery获取指定元素下的子元素

(function () { ("#div1").next().addClass("am-active"); 获得div1的下一个元素 ("#div1").next().find("dd").addClass("am-in"); 获得div1下一个元素的 指定子元素}) ...

jquery中如何获取当前DOM对象里的子元素?

一、使用children()方法获得子元素 1、使用该方法获取子元素并设置子元素的字体为蓝色,代码如下:&lt;!DOCTYPE html&gt; body { font-size:16px; font-weight:bolder; } p { margin:5px 0; } Hello Hello ...

jquery如何获取子标签的IDŀ

1、使用jquery来操作,先引入jquery脚本文件。2、然后添加一些简单的html,这里主要的就是在一个div里添加了二个a链接,div和a链接就各自有id属性,还有一个操作的按钮,加上了onclick事件的。3、添加对应的点击事件函数。4...

jquery第一个子节点怎么获得

方法如下: 获取第一个元素 $("#body").children(":first") 判断获取元素的标签 $("#body").children(":first").attr("tagName") == "STRONG" JQuery是继prototype之后又一个优秀的Javascript库。它是轻量级的js库...

本文如未解决您的问题请添加抖音号:51dongshi(抖音搜索懂视),直接咨询即可。

热门图文

  • 汭字的组词 汭字的组词有哪些

    1、汭组词是妫汭、嬀汭、淮汭、洛汭、沩汭、伊汭、沙汭、渭汭。2、笔画是7。3、读音是ruì。4、笔顺是点、点、提、竖、横折钩、撇、点。5、部首是氵。6、结构是左右结构。7、解释是(名)〈书〉河流会合或拐弯的地方。8、诗是《桐汭·东汭波吞岸》、《庚戌春下鄱阳舟中诸作·解舟汭口》、《解舟汭口·浩荡春江洗客愁》、《浣溪沙·题宋生谋玚《怀珠绮语》与沩汭》、《初入浙中·我生豫章汭》、《七言·别来洛汭六东风》、《过吴门访沈野范汭携酒至因赋》、《寒夜与范汭过黄习远萧萧斋宿得人字》、《寓范汭家过其友卞润甫新居》、《成汭·劳役三年成巨舰》。

  • 汭字的组词有哪些

    1、汭组词是妫汭、嬀汭、淮汭、洛汭、沩汭、伊汭、沙汭、渭汭。2、笔画是7。3、读音是ruì。4、笔顺是点、点、提、竖、横折钩、撇、点。5、部首是氵。6、结构是左右结构。7、解释是(名)〈书〉河流会合或拐弯的地方。8、诗是《桐汭·东汭波吞岸》、《庚戌春下鄱阳舟中诸作·解舟汭口》、《解舟汭口·浩荡春江洗客愁》、《浣溪沙·题宋生谋玚《怀珠绮语》与沩汭》、《初入浙中·我生豫章汭》、《七言·别来洛汭六东风》、《过吴门访沈野范汭携酒至因赋》、《寒夜与范汭过黄习远萧萧斋宿得人字》、《寓范汭家过其友卞润甫新居》、《成汭·劳役三年成巨舰》。

  • 汭字的组词

    1、汭组词是妫汭、嬀汭、淮汭、洛汭、沩汭、伊汭、沙汭、渭汭。2、笔画是7。3、读音是ruì。4、笔顺是点、点、提、竖、横折钩、撇、点。5、部首是氵。6、结构是左右结构。7、解释是(名)〈书〉河流会合或拐弯的地方。8、诗是《桐汭·东汭波吞岸》、《庚戌春下鄱阳舟中诸作·解舟汭口》、《解舟汭口·浩荡春江洗客愁》、《浣溪沙·题宋生谋玚《怀珠绮语》与沩汭》、《初入浙中·我生豫章汭》、《七言·别来洛汭六东风》、《过吴门访沈野范汭携酒至因赋》、《寒夜与范汭过黄习远萧萧斋宿得人字》、《寓范汭家过其友卞润甫新居》、《成汭·劳役三年成巨舰》。

  • 汭字组词 汭字组词有哪些

    1、汭组词是妫汭、嬀汭、淮汭、洛汭、沩汭、伊汭、沙汭、渭汭。2、笔画是7。3、读音是ruì。4、笔顺是点、点、提、竖、横折钩、撇、点。5、部首是氵。6、结构是左右结构。7、解释是(名)〈书〉河流会合或拐弯的地方。8、诗是《桐汭·东汭波吞岸》、《庚戌春下鄱阳舟中诸作·解舟汭口》、《解舟汭口·浩荡春江洗客愁》、《浣溪沙·题宋生谋玚《怀珠绮语》与沩汭》、《初入浙中·我生豫章汭》、《七言·别来洛汭六东风》、《过吴门访沈野范汭携酒至因赋》、《寒夜与范汭过黄习远萧萧斋宿得人字》、《寓范汭家过其友卞润甫新居》、《成汭·劳役三年成巨舰》。

  • 汭字组词有哪些

    1、汭组词是妫汭、嬀汭、淮汭、洛汭、沩汭、伊汭、沙汭、渭汭。2、笔画是7。3、读音是ruì。4、笔顺是点、点、提、竖、横折钩、撇、点。5、部首是氵。6、结构是左右结构。7、解释是(名)〈书〉河流会合或拐弯的地方。8、诗是《桐汭·东汭波吞岸》、《庚戌春下鄱阳舟中诸作·解舟汭口》、《解舟汭口·浩荡春江洗客愁》、《浣溪沙·题宋生谋玚《怀珠绮语》与沩汭》、《初入浙中·我生豫章汭》、《七言·别来洛汭六东风》、《过吴门访沈野范汭携酒至因赋》、《寒夜与范汭过黄习远萧萧斋宿得人字》、《寓范汭家过其友卞润甫新居》、《成汭·劳役三年成巨舰》。

Top