和的属性是什么意思啊(社会属性和自然属性的区别)

kinkin 2023-02-11 阅读:147

DOM和SUB是什么属性,dom属性指什么意思。发迹号带你了解更多相关信息。DOM还使用术语元素(Element)它与节点非常相似。那么,DOM节点和元素之间有什么区别呢?1.DOM节点理解节点和元素之间区别的关键是理解节点是什么。更高的角度来看

和的属性是什么意思啊(社会属性和自然属性的区别)

DOM和SUB是什么属性,dom属性指什么意思。发迹号带你了解更多相关信息。

DOM 还使用术语元素(Element)它与节点非常相似。那么,DOM节点和元素之间有什么区别呢?

1. DOM节点

理解节点和元素之间区别的关键是理解节点是什么。

更高的角度来看,DOM文档由节点层次结构组成。每个节点可以具有父级和/或子级。

看看下面的HTML文档:

My Page

My Page

Thank you for visiting my web page!

 

该文档包含以下节点层次结构:

是文档树中的一个节点。它有2个子节点:和。

子有3个子节点的节点:注释节点 ,标题

,段落

。节点的父节点是节点。

HTML文档中的标记代表一个节点,有趣的是普通文本也是一个节点。段落节点

有1个子节点:文本节点“Thank you for visiting my web page!”。

1.2节点类型

我们要如何区分这些不同类型的节点?答案在于DOM Node接口,尤其是Node.nodeType属性。

Node.nodeType可以具有代表节点类型的以下值之一:

Node.ELEMENT_NODE Node.ATTRIBUTE_NODE Node.TEXT_NODE Node.CDATA_SECTION_NODE Node.PROCESSING_INSTRUCTION_NODE Node.DOCUMENT_NODE Node.DOCUMENT_TYPE_NODE Node.DOCUMENT_FRAGMENT_NODE Node.NOTATION_NODE

常量有意义地指示节点类型:例如Node.ELEMENT_NODE代表元素节点,Node.TEXT_NODE代表文本节点,Node.DOCUMENT_NODE文档节点,依此类推。

例如,让我们选择段落节点,然后查看其nodeType属性:

const paragraph = document.querySelector(p);

paragraph.nodeType === Node.ELEMENT_NODE; // => true

代表整个节点文档树的节点类型为Node.DOCUMENT_NODE:

document.nodeType === Node.DOCUMENT_NODE; // => true
 

2. DOM元素

掌握了DOM节点的知识之后,现在该区分DOM节点和元素了。

如果你了解节点术语,那么答案是显而易见的:元素是特定类型的节点 element (Node.ELEMENT_NODE),以及文档、注释、文本等类型。

简而言之,元素是使用HTML文档中的标记编写的节点。,,,,</p><h2>,</p><p>都是元素,因为它们由标签表示。</p><p>文档类型,注释,文本节点不是元素,因为它们没有使用标签编写:</p><p>Node是节点的构造函数,HTMLElement 是 JS DOM 中元素的构造函数。段落既是节点又是元素,它同时是Node和HTMLElement的实例</p><p>const paragraph = document.querySelector(p);</p><p>paragraph instanceof Node;        // => true<br />paragraph instanceof HTMLElement; // => true</p><p>简单地说,元素是节点的子类型,就像猫是动物的子类型一样。</p><p>3. DOM属性:节点和元素</p><p>除了区分节点和元素之外,还需要区分只包含节点或只包含元素的DOM属性。</p><p>节点类型的以下属性评估为一个节点或节点集合(NodeList):</p><p>node.parentNode; // Node or null</p><p>node.firstChild; // Node or null<br />  // Node or null</p><p>node.childNodes; // NodeList</p><p>但是,以下属性是元素或元素集合(HTMLCollection):</p><p>node.parentElement; // HTMLElement or null</p><p>node.children;      // HTMLCollection</p><p>由于node.childNodes和node.children都返回子级列表,因此为什么要同时具有这两个属性?好问题!</p><p>考虑以下包含某些文本的段落元素:</p><p><p><b>Thank you</b> for visiting my web page!</p><p> </p><p>打开演示,然后查看parapgraph节点的childNodes和children属性:</p><p>const paragraph = document.querySelector(p);</p><p>paragraph.childNodes; // NodeList:       [HTMLElement, Text]<br />paragraph.children;   // HTMLCollection: [HTMLElement]</p><p>paragraph.childNodes集合包含2个节点:<b>Thank you</b>,,以及for visiting my web page!文本节点!</p><p>但是,paragraph.children集合仅包含1个项目:<b>Thank you</b>。</p><p>由于paragraph.children仅包含元素,因此此处未包含文本节点,因为其类型是文本(Node.TEXT_NODE),而不是元素(Node.ELEMENT_NODE)。</p><p>同时拥有node.childNodes和node.children,我们可以选择要访问的子级集合:所有子级节点或仅子级是元素。</p><p>4.总结</p><p>DOM文档是节点的分层集合,每个节点可以具有父级和/或子级。如果了解节点是什么,那么了解DOM节点和元素之间的区别就很容易。</p><p>节点有类型,元素类型就是其中之一,元素由HTML文档中的标记表示。</p><p>完~ 我是小智,我要去刷碗了,我们下期再见!</p> </article> <div class="posttheme"> <a href="https://ztlljy.com/cyzn" rel="category tag">创业指南</a> </div> <div class="xshare"> <div class="social-share" data-initialized="true"> <a href="#" class="share-weixin social-share-icon icon-wechat">分享到微信</a> <a href="#" class="share-weibo social-share-icon icon-weibo">分享到微博</a> <a href="#" class="share-qq social-share-icon icon-qq">分享到QQ</a> </div> </div> <div class="relates"> <h3> 相关推荐:</h3> <ul> <li><a href="https://ztlljy.com/cyzn/170127.html">怎样赚钱创业? 怎样创业赚钱?</a></li> <li><a href="https://ztlljy.com/cyzn/175812.html">零零后创业文案? 怎样赚钱创业?</a></li> <li><a href="https://ztlljy.com/cyzn/6801.html">什么工作比较轻松又不累(什么工作比较轻松自由又稳定)</a></li> <li><a href="https://ztlljy.com/cyzn/125799.html">如何利用创业板开通赚取利润</a></li> <li><a href="https://ztlljy.com/cyzn/164249.html">创业致富的五个致命错误,十分值得注意!</a></li> <li><a href="https://ztlljy.com/cyzn/6899.html">百度推广优化设置技巧有哪些(百度优化推广方法)</a></li> <li><a href="https://ztlljy.com/cyzn/114206.html">揭秘创业成功的5个小技巧,助你轻松赚钱</a></li> <li><a href="https://ztlljy.com/cyzn/184857.html">迎接第二波创业浪潮:机遇与挑战并存</a></li> </ul> </div> </div> </div> </div> </div> <div class="sidebar"> <div class="author-article block"> <div class="top"> <img class="avatar" src="https://ztlljy.com/zb_users/avatar/0.png"> <div class="info"> <div class="name"> <a href="https://ztlljy.com/author-2.html" target="_blank">kinkin</a> </div> <div class="wishes"> </div> </div> </div> <div class="articles"> <ul class="articles-ul"> <li><span class="dot"></span><a href="https://ztlljy.com/kp/79462.html" target="_blank">马凡氏综合症(马凡氏综合症图片)</a></li> <li><span class="dot"></span><a href="https://ztlljy.com/shcs/42722.html" target="_blank">广东3b学校排名(广东3b学校排行榜)</a></li> <li><span class="dot"></span><a href="https://ztlljy.com/kp/90600.html" target="_blank">中国出兵朝鲜(中国出兵朝鲜最根本的原因是 )</a></li> </ul> <div> <a class="more-articles" href="https://ztlljy.com/author-2.html" target="_blank">更多文章 ></a> </div> </div> </div> <div class="widget widget-tie ZF_PostArticle"> <ul> <div class="PostArticle"><ul class="Tabe"><li><h3 class="Tit">最新文章</h3></li><li><h3 class="Tit">热评文章</h3></li><li><h3 class="Tit">热门文章</h3></li></ul><div class="TabeCon"><ul><li><i class="num1">1</i><a href="https://ztlljy.com/cyjy/118411.html" title="如何成功创业?100位创业者分享的经验">如何成功创业?100位创业者分享的经验</a></li><li><i class="num2">2</i><a href="https://ztlljy.com/kp/79462.html" title="马凡氏综合症(马凡氏综合症图片)">马凡氏综合症(马凡氏综合症图片)</a></li><li><i class="num3">3</i><a href="https://ztlljy.com/shcs/42722.html" title="广东3b学校排名(广东3b学校排行榜)">广东3b学校排名(广东3b学校排行榜)</a></li><li><i class="num4">4</i><a href="https://ztlljy.com/kp/90600.html" title="中国出兵朝鲜(中国出兵朝鲜最根本的原因是 )">中国出兵朝鲜(中国出兵朝鲜最根本的原因是 )</a></li><li><i class="num5">5</i><a href="https://ztlljy.com/kp/70025.html" title="提升学历的机构哪个靠谱(提升学历的机构可靠吗)">提升学历的机构哪个靠谱(提升学历的机构可靠吗)</a></li><li><i class="num6">6</i><a href="https://ztlljy.com/shcs/46487.html" title="网博(网博平台)">网博(网博平台)</a></li><li><i class="num7">7</i><a href="https://ztlljy.com/yltg/164827.html" title="如何有效推广和引流优质小视频内容">如何有效推广和引流优质小视频内容</a></li><li><i class="num8">8</i><a href="https://ztlljy.com/kp/59849.html" title="蒙泰教程(蒙泰教程教学快捷键)">蒙泰教程(蒙泰教程教学快捷键)</a></li></ul><ul><li><i class="num1">1</i><a href="https://ztlljy.com/kj/184860.html" title="未来已来:高科技豪宅与智能家居的无缝融合">未来已来:高科技豪宅与智能家居的无缝融合</a></li><li><i class="num2">2</i><a href="https://ztlljy.com/shcs/184859.html" title="胃不喜欢寒冷,你可能不知道的生活常识">胃不喜欢寒冷,你可能不知道的生活常识</a></li><li><i class="num3">3</i><a href="https://ztlljy.com/ztbk/184858.html" title="如何在电子设备行业中开创自己的创业之路">如何在电子设备行业中开创自己的创业之路</a></li><li><i class="num4">4</i><a href="https://ztlljy.com/cyzn/184857.html" title="迎接第二波创业浪潮:机遇与挑战并存">迎接第二波创业浪潮:机遇与挑战并存</a></li><li><i class="num5">5</i><a href="https://ztlljy.com/kp/184856.html" title="轻松掌握健康知识:热门科普内容全攻略">轻松掌握健康知识:热门科普内容全攻略</a></li><li><i class="num6">6</i><a href="https://ztlljy.com/kp/184855.html" title="内蒙古宴会礼服创业:如何在市场中脱颖而出">内蒙古宴会礼服创业:如何在市场中脱颖而出</a></li><li><i class="num7">7</i><a href="https://ztlljy.com/cyjy/184854.html" title="如何利用人社局的资源打造创业成功之路">如何利用人社局的资源打造创业成功之路</a></li><li><i class="num8">8</i><a href="https://ztlljy.com/shcs/184853.html" title="提升家庭健康的秘籍:必备健康常识书推荐">提升家庭健康的秘籍:必备健康常识书推荐</a></li></ul><ul><li><i class="num1">1</i><a href="https://ztlljy.com/shcs/41491.html" title="李连杰逝世讣告(李连杰死亡经历)">李连杰逝世讣告(李连杰死亡经历)</a></li><li><i class="num2">2</i><a href="https://ztlljy.com/shcs/46524.html" title="历届国家总经理是谁的简单介绍">历届国家总经理是谁的简单介绍</a></li><li><i class="num3">3</i><a href="https://ztlljy.com/kp/56753.html" title="手写输入查字(手写输入查字典)">手写输入查字(手写输入查字典)</a></li><li><i class="num4">4</i><a href="https://ztlljy.com/kp/67675.html" title="原来真的能把肚子顶起来(肚子真的会顶出形状)">原来真的能把肚子顶起来(肚子真的会顶出形状)</a></li><li><i class="num5">5</i><a href="https://ztlljy.com/kp/54364.html" title="赛尔号神兽(赛尔号神兽之子)">赛尔号神兽(赛尔号神兽之子)</a></li><li><i class="num6">6</i><a href="https://ztlljy.com/kp/48160.html" title="乔任梁现场图血肠子天涯(乔任梁真相天涯)">乔任梁现场图血肠子天涯(乔任梁真相天涯)</a></li><li><i class="num7">7</i><a href="https://ztlljy.com/kp/56761.html" title="与君同舟渡小说(与君同舟渡小说全文免费阅读)">与君同舟渡小说(与君同舟渡小说全文免费阅读)</a></li><li><i class="num8">8</i><a href="https://ztlljy.com/ztbk/18122.html" title="奇怪的理发店韩版带中译(奇怪的理发店韩国在1)">奇怪的理发店韩版带中译(奇怪的理发店韩国在1)</a></li></ul></div></div> </ul> </div> <div class="widget widget-tie divPrevious"> <h3>站长推荐</h3> <h5>previous</h5> <ul> <li> <a href="https://ztlljy.com/kj/184860.html" title="未来已来:高科技豪宅与智能家居的无缝融合" rel="bookmark"> <span class="thumbnail"> <img src="https://ztlljy.com/zb_users/plugin/FY_IMG/pic.php?src=aHR0cHM6Ly96dGxsankuY29tL3piX3VzZXJzL3RoZW1lL1NfTWVkaWEvc3R5bGUvaW1nLzEuanBn&width=200&height=125&cuttype=4" alt="未来已来:高科技豪宅与智能家居的无缝融合" /> </span> <span class="text">未来已来:高科技豪宅与智能家居的无缝融合</span> <span class="muted">2025-02-16</span><span class="muted">阅读(18)</span> </a> </li> <li> <a href="https://ztlljy.com/shcs/184859.html" title="胃不喜欢寒冷,你可能不知道的生活常识" rel="bookmark"> <span class="thumbnail"> <img src="https://ztlljy.com/zb_users/plugin/FY_IMG/pic.php?src=aHR0cHM6Ly96dGxsankuY29tL3piX3VzZXJzL3RoZW1lL1NfTWVkaWEvc3R5bGUvaW1nLzQuanBn&width=200&height=125&cuttype=4" alt="胃不喜欢寒冷,你可能不知道的生活常识" /> </span> <span class="text">胃不喜欢寒冷,你可能不知道的生活常识</span> <span class="muted">2025-02-16</span><span class="muted">阅读(15)</span> </a> </li> <li> <a href="https://ztlljy.com/ztbk/184858.html" title="如何在电子设备行业中开创自己的创业之路" rel="bookmark"> <span class="thumbnail"> <img src="https://ztlljy.com/zb_users/plugin/FY_IMG/pic.php?src=aHR0cHM6Ly96dGxsankuY29tL3piX3VzZXJzL3RoZW1lL1NfTWVkaWEvc3R5bGUvaW1nLzQuanBn&width=200&height=125&cuttype=4" alt="如何在电子设备行业中开创自己的创业之路" /> </span> <span class="text">如何在电子设备行业中开创自己的创业之路</span> <span class="muted">2025-02-16</span><span class="muted">阅读(11)</span> </a> </li> <li> <a href="https://ztlljy.com/cyzn/184857.html" title="迎接第二波创业浪潮:机遇与挑战并存" rel="bookmark"> <span class="thumbnail"> <img src="https://ztlljy.com/zb_users/plugin/FY_IMG/pic.php?src=aHR0cHM6Ly96dGxsankuY29tL3piX3VzZXJzL3RoZW1lL1NfTWVkaWEvc3R5bGUvaW1nLzUuanBn&width=200&height=125&cuttype=4" alt="迎接第二波创业浪潮:机遇与挑战并存" /> </span> <span class="text">迎接第二波创业浪潮:机遇与挑战并存</span> <span class="muted">2025-02-16</span><span class="muted">阅读(16)</span> </a> </li> <li> <a href="https://ztlljy.com/kp/184856.html" title="轻松掌握健康知识:热门科普内容全攻略" rel="bookmark"> <span class="thumbnail"> <img src="https://ztlljy.com/zb_users/plugin/FY_IMG/pic.php?src=aHR0cHM6Ly96dGxsankuY29tL3piX3VzZXJzL3RoZW1lL1NfTWVkaWEvc3R5bGUvaW1nLzUuanBn&width=200&height=125&cuttype=4" alt="轻松掌握健康知识:热门科普内容全攻略" /> </span> <span class="text">轻松掌握健康知识:热门科普内容全攻略</span> <span class="muted">2025-02-16</span><span class="muted">阅读(17)</span> </a> </li> <li> <a href="https://ztlljy.com/kp/184855.html" title="内蒙古宴会礼服创业:如何在市场中脱颖而出" rel="bookmark"> <span class="thumbnail"> <img src="https://ztlljy.com/zb_users/plugin/FY_IMG/pic.php?src=aHR0cHM6Ly96dGxsankuY29tL3piX3VzZXJzL3RoZW1lL1NfTWVkaWEvc3R5bGUvaW1nLzEuanBn&width=200&height=125&cuttype=4" alt="内蒙古宴会礼服创业:如何在市场中脱颖而出" /> </span> <span class="text">内蒙古宴会礼服创业:如何在市场中脱颖而出</span> <span class="muted">2025-02-16</span><span class="muted">阅读(19)</span> </a> </li> <li> <a href="https://ztlljy.com/cyjy/184854.html" title="如何利用人社局的资源打造创业成功之路" rel="bookmark"> <span class="thumbnail"> <img src="https://ztlljy.com/zb_users/plugin/FY_IMG/pic.php?src=aHR0cHM6Ly96dGxsankuY29tL3piX3VzZXJzL3RoZW1lL1NfTWVkaWEvc3R5bGUvaW1nLzQuanBn&width=200&height=125&cuttype=4" alt="如何利用人社局的资源打造创业成功之路" /> </span> <span class="text">如何利用人社局的资源打造创业成功之路</span> <span class="muted">2025-02-16</span><span class="muted">阅读(13)</span> </a> </li> <li> <a href="https://ztlljy.com/shcs/184853.html" title="提升家庭健康的秘籍:必备健康常识书推荐" rel="bookmark"> <span class="thumbnail"> <img src="https://ztlljy.com/zb_users/plugin/FY_IMG/pic.php?src=aHR0cHM6Ly96dGxsankuY29tL3piX3VzZXJzL3RoZW1lL1NfTWVkaWEvc3R5bGUvaW1nLzIuanBn&width=200&height=125&cuttype=4" alt="提升家庭健康的秘籍:必备健康常识书推荐" /> </span> <span class="text">提升家庭健康的秘籍:必备健康常识书推荐</span> <span class="muted">2025-02-16</span><span class="muted">阅读(20)</span> </a> </li> <li> <a href="https://ztlljy.com/yltg/184852.html" title="全方位提升业务的推广服务攻略" rel="bookmark"> <span class="thumbnail"> <img src="https://ztlljy.com/zb_users/plugin/FY_IMG/pic.php?src=aHR0cHM6Ly96dGxsankuY29tL3piX3VzZXJzL3RoZW1lL1NfTWVkaWEvc3R5bGUvaW1nLzUuanBn&width=200&height=125&cuttype=4" alt="全方位提升业务的推广服务攻略" /> </span> <span class="text">全方位提升业务的推广服务攻略</span> <span class="muted">2025-02-16</span><span class="muted">阅读(21)</span> </a> </li> <li> <a href="https://ztlljy.com/kj/184851.html" title="探索高科技智能语音通话器的未来:颠覆传统通讯方式" rel="bookmark"> <span class="thumbnail"> <img src="https://ztlljy.com/zb_users/plugin/FY_IMG/pic.php?src=aHR0cHM6Ly96dGxsankuY29tL3piX3VzZXJzL3RoZW1lL1NfTWVkaWEvc3R5bGUvaW1nLzIuanBn&width=200&height=125&cuttype=4" alt="探索高科技智能语音通话器的未来:颠覆传统通讯方式" /> </span> <span class="text">探索高科技智能语音通话器的未来:颠覆传统通讯方式</span> <span class="muted">2025-02-16</span><span class="muted">阅读(20)</span> </a> </li> </ul> </div> <div class="widget widget-tie modules_HotViewArticle"> <h3>热门阅读</h3> <h5>modules_hotviewarticle</h5> <ul> <li class="sideitem"><div class="sideimg"> <a href="https://ztlljy.com/kp/93538.html"> <img src="https://www.ztlljy.com/zb_users/upload/editor/water/2024-02-24/65d951311f97f.jpeg" alt="藏传密宗可怕法器肉莲图片(藏传密宗的肉莲)"> </a> </div><div class="hasimg"><a href="https://ztlljy.com/kp/93538.html" title="藏传密宗可怕法器肉莲图片(藏传密宗的肉莲)" class="itemtitle">藏传密宗可怕法器肉莲图片(藏传密宗的肉莲)</a></div><p class="sideinfo"><span class="view">10305 浏览</span>科普</p> </li><li class="sideitem"><div class="sideimg"> <a href="https://ztlljy.com/kp/92620.html"> <img src="https://www.ztlljy.com/zb_users/upload/editor/water/2024-02-20/65d41cd01e8a8.jpeg" alt="藏传少女肉莲法器是做什么用的(藏传密宗可怕法器肉莲有什么用)"> </a> </div><div class="hasimg"><a href="https://ztlljy.com/kp/92620.html" title="藏传少女肉莲法器是做什么用的(藏传密宗可怕法器肉莲有什么用)" class="itemtitle">藏传少女肉莲法器是做什么用的(藏传密宗可怕法器肉莲有什么用)</a></div><p class="sideinfo"><span class="view">5501 浏览</span>科普</p> </li><li class="sideitem"><a href="https://ztlljy.com/cyzn/161203.html" title="2021年最赚钱的创业项目有哪些?" class="itemtitle">2021年最赚钱的创业项目有哪些?</a><p class="sideinfo"><span class="view">3417 浏览</span>创业指南</p> </li><li class="sideitem"><a href="https://ztlljy.com/kp/156102.html" title="如何成功从狱警转岗到公安系统?这是我的经验分享" class="itemtitle">如何成功从狱警转岗到公安系统?这是我的经验分享</a><p class="sideinfo"><span class="view">2908 浏览</span>科普</p> </li><li class="sideitem"><div class="sideimg"> <a href="https://ztlljy.com/kp/99464.html"> <img src="https://www.ztlljy.com/zb_users/upload/editor/water/2024-03-24/65ff12d4075ab.jpeg" alt="生活帮电话(生活帮记者电话)"> </a> </div><div class="hasimg"><a href="https://ztlljy.com/kp/99464.html" title="生活帮电话(生活帮记者电话)" class="itemtitle">生活帮电话(生活帮记者电话)</a></div><p class="sideinfo"><span class="view">1936 浏览</span>科普</p> </li> </ul> </div> <div id="module" class="following"> </div> </div> </div> <footer class="footer"> <div class="footer-content"> <p> © 助推了 2025 <a href=" https://ztlljy.com/sitemap.xml" title="网站地图" target="_blank">网站地图</a>  QQ:63263   </p> </div> </footer> <div class="bottom_tools" style="bottom: 40px;"> <a id="scrollUp" href="javascript:;" title="飞回顶部" style="display: block;"></a> </div> <link rel="stylesheet" rev="stylesheet" href="https://ztlljy.com/zb_users/theme/S_Media/style/css/share.min.css" type="text/css" media="all"/> <script type="text/javascript" src="https://ztlljy.com/zb_users/theme/S_Media/style/js/jquery.share.min.js"></script> <script src="https://ztlljy.com/zb_users/theme/S_Media/style/js/functions.js"></script> <script> $('.Tabe li:first-child').addClass('active'); $('.TabeCon ul:first-child').show(); let key = 0; let base_num = 1000; let speed = Number('5') * 1000; if(isNaN(speed)){ speed = 0; } let playTimer = null; if(speed >= base_num){ playTimer = setInterval(auto_tabs,speed); } function tabs(tabTit,on,tabCon){ $(tabTit).children().mouseenter(function() { $(this).addClass(on).siblings().removeClass(on); let index = key = $(tabTit).children().index(this); $(tabCon).children().eq(index).fadeIn(200).siblings().fadeOut(0); if(speed >= base_num && playTimer !== null){ clearInterval(playTimer); } }); $(tabTit).children().mouseleave(function() { if(speed >= base_num && playTimer !== null){ playTimer = setInterval(auto_tabs,speed) } }); $(tabCon).mouseenter(function() { if(speed >= base_num && playTimer !== null){ clearInterval(playTimer); } }); $(tabCon).mouseleave(function() { if(speed >= base_num && playTimer !== null){ playTimer = setInterval(auto_tabs,speed) } }); }; function auto_tabs(tabTit='.Tabe',on='active',tabCon='.TabeCon'){ if(key >= 3){ key = 0; } $(tabTit).children().eq(key).addClass(on).siblings().removeClass(on); $(tabCon).children().eq(key).fadeIn(200).siblings().fadeOut(0); key++; }; tabs('.Tabe','active','.TabeCon'); </script> <script src="https://ztlljy.com/zb_users/plugin/Jz52_sjyw/ajax.js"></script> </body> </html><!--5,464.63 ms , 12 queries , 10829kb memory , 0 error-->