jQuery-数据提取问题(html遍历)
jQuery - Issue with data extraction (html traversing)
在我的页面中有一个id为"accordon"的标签。这是它的内部html:
<DIV class="group section" jQuery18007183007327795561="8">
<H3 aria-expanded=false class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role=tab tabIndex=-1 aria-selected=false jQuery18007183007327795561="5">
<SPAN class="ui-icon ui-icon-triangle-1-e">
</SPAN>
<A tabIndex=-1 href="#">
1. section name
</A>
</H3>
<DIV style="DISPLAY: none" class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" role=tabpanel jQuery18007183007327795561="31">
<DIV id=accordion1 class="ui-accordion ui-widget ui-helper-reset ui-accordion-icons ui-sortable" role=tablist jQuery18007183007327795561="11">
<DIV class=group jQuery18007183007327795561="14">
<H3 aria-expanded=true class="ui-accordion-header ui-helper-reset ui-state-default ui-state-active ui-corner-top" role=tab tabIndex=0 aria-selected=true jQuery18007183007327795561="12">
<SPAN class="ui-icon ui-icon-triangle-1-s">
</SPAN>
<A tabIndex=-1 href="#">
item name
</A>
</H3>
<DIV class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" role=tabpanel>
<A href="#">
Edit Item
</A>
<BR>
<SPAN style="DISPLAY: none">
4900bc3b-a086-4d0c-89b8-09e3724aac8e
</SPAN>
</DIV>
</DIV>
<DIV class=group jQuery18007183007327795561="15">
<H3 aria-expanded=false class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role=tab tabIndex=-1 aria-selected=false jQuery18007183007327795561="13">
<SPAN class="ui-icon ui-icon-triangle-1-e">
</SPAN>
<A tabIndex=-1 href="#">
item name
</A>
</H3>
<DIV style="DISPLAY: none" class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" role=tabpanel>
<A href="#">
Edit Item
</A>
<BR>
<SPAN style="DISPLAY: none">
0d59f87e-a294-4f85-beae-a0e266ab6a7e
</SPAN>
</DIV>
</DIV>
</DIV>
</DIV>
</DIV>
<DIV class="group section" jQuery18007183007327795561="9">
<H3 aria-expanded=false class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role=tab tabIndex=-1 aria-selected=false jQuery18007183007327795561="6">
<SPAN class="ui-icon ui-icon-triangle-1-e">
</SPAN>
<A tabIndex=-1 href="#">
2. section name
</A>
</H3>
<DIV style="DISPLAY: none" class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" role=tabpanel>
<DIV id=accordion2 class="ui-accordion ui-widget ui-helper-reset ui-accordion-icons ui-sortable" role=tablist jQuery18007183007327795561="16">
<DIV class=group jQuery18007183007327795561="20">
<H3 aria-expanded=true class="ui-accordion-header ui-helper-reset ui-state-default ui-state-active ui-corner-top" role=tab tabIndex=0 aria-selected=true jQuery18007183007327795561="17">
<SPAN class="ui-icon ui-icon-triangle-1-s">
</SPAN>
<A tabIndex=-1 href="#">
item name
</A>
</H3>
<DIV class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" role=tabpanel>
<A href="#">
Edit Item
</A>
<BR>
<SPAN style="DISPLAY: none">
1cbd8a6b-3a90-4ee7-8072-68663b42e937
</SPAN>
</DIV>
</DIV>
<DIV class=group jQuery18007183007327795561="21">
<H3 aria-expanded=false class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role=tab tabIndex=-1 aria-selected=false jQuery18007183007327795561="18">
<SPAN class="ui-icon ui-icon-triangle-1-e">
</SPAN>
<A tabIndex=-1 href="#">
item name
</A>
</H3>
<DIV style="DISPLAY: none" class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" role=tabpanel>
<A href="#">
Edit Item
</A>
<BR>
<SPAN style="DISPLAY: none">
5a02ebe6-41cd-441c-9b4e-7c40e4e6d8f9
</SPAN>
</DIV>
</DIV>
<DIV class=group jQuery18007183007327795561="22">
<H3 aria-expanded=false class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role=tab tabIndex=-1 aria-selected=false jQuery18007183007327795561="19">
<SPAN class="ui-icon ui-icon-triangle-1-e">
</SPAN>
<A tabIndex=-1 href="#">
item name
</A>
</H3>
<DIV style="DISPLAY: none" class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" role=tabpanel>
<A href="#">
Edit Item
</A>
<BR>
<SPAN style="DISPLAY: none">
f4408171-033b-454c-9fc1-5849e7c0c65b
</SPAN>
</DIV>
</DIV>
</DIV>
</DIV>
</DIV>
<DIV class="group section" sizset="true" sizcache006684201465290301="0.0.5" jQuery18007183007327795561="10">
<H3 aria-expanded=true class="ui-accordion-header ui-helper-reset ui-state-active ui-corner-top" role=tab tabIndex=0 aria-selected=true jQuery18007183007327795561="7">
<SPAN class="ui-icon ui-icon-triangle-1-s">
</SPAN>
<A tabIndex=-1 href="#">
3. section name
</A>
</H3>
<DIV style="PADDING-BOTTOM: 11px; DISPLAY: block; OVERFLOW: auto; PADDING-TOP: 11px" class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" role=tabpanel sizset="false" sizcache006684201465290301="0.0.5" jQuery18007183007327795561="30">
<DIV id=accordion3 class="ui-accordion ui-widget ui-helper-reset ui-accordion-icons ui-sortable" role=tablist sizset="false" sizcache006684201465290301="0.0.5" jQuery18007183007327795561="23">
<DIV class=group jQuery18007183007327795561="27">
<H3 aria-expanded=true class="ui-accordion-header ui-helper-reset ui-state-default ui-state-active ui-corner-top" role=tab tabIndex=0 aria-selected=true jQuery18007183007327795561="24">
<SPAN class="ui-icon ui-icon-triangle-1-s">
</SPAN>
<A tabIndex=-1 href="#">
item name
</A>
</H3>
<DIV class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" role=tabpanel>
<A href="#">
Edit Item
</A>
<BR>
<SPAN style="DISPLAY: none">
a45a589c-e829-4ea7-b615-a7975b1dcf31
</SPAN>
</DIV>
</DIV>
<DIV class=group jQuery18007183007327795561="28">
<H3 aria-expanded=false class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role=tab tabIndex=-1 aria-selected=false jQuery18007183007327795561="25">
<SPAN class="ui-icon ui-icon-triangle-1-e">
</SPAN>
<A tabIndex=-1 href="#">
item name
</A>
</H3>
<DIV style="DISPLAY: none" class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" role=tabpanel>
<A href="#">
Edit Item
</A>
<BR>
<SPAN style="DISPLAY: none">
20f03252-bad2-4016-9bab-b8be5b07761e
</SPAN>
</DIV>
</DIV>
<DIV class=group jQuery18007183007327795561="29">
<H3 aria-expanded=false class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role=tab tabIndex=-1 aria-selected=false jQuery18007183007327795561="26">
<SPAN class="ui-icon ui-icon-triangle-1-e">
</SPAN>
<A tabIndex=-1 href="#">
item name
</A>
</H3>
<DIV style="DISPLAY: none" class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" role=tabpanel>
<A href="#">
Edit Item
</A>
<BR>
<SPAN style="DISPLAY: none">
4ab593fd-cf32-4eb0-814a-29b1486ee121
</SPAN>
</DIV>
</DIV>
</DIV>
</DIV>
</DIV>
我希望能够提取文本,但只能提取某些文本。结构类似于:
1. <section name>
<item>
<item>
.
.
.
2. <section name>
3. <section name>
.
.
.
我需要提取部门名称和项目ID号(例如4900bc3b-a086-4d0c-89b-09e3724aac8e)。
根据提取,我需要创建一个字符串,将所有数据组合在一起(以一种稍后易于阅读且没有任何缺陷的方式),例如:<section name>~~<item ID>,<item ID>^^<section name>~~<item ID>,<item ID>
。。。etc
如何编写jquery选择代码?我不知道。。。
注意:请注意,section的类是"group section",items的类为"group",也许这会有所帮助?
感谢
你能按如下方式修改这个Html吗:
<DIV class="group section" jQuery18007183007327795561="8">
<H3 aria-expanded=false class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role=tab tabIndex=-1 aria-selected=false jQuery18007183007327795561="5">
<SPAN class="ui-icon ui-icon-triangle-1-e">
</SPAN>
<A class="SelectThis" tabIndex=-1 href="#">
1. section name
</A>
</H3>
<DIV style="DISPLAY: none" class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" role=tabpanel jQuery18007183007327795561="31">
<DIV id=accordion1 class="ui-accordion ui-widget ui-helper-reset ui-accordion-icons ui-sortable" role=tablist jQuery18007183007327795561="11">
<DIV class=group jQuery18007183007327795561="14">
<H3 aria-expanded=true class="ui-accordion-header ui-helper-reset ui-state-default ui-state-active ui-corner-top" role=tab tabIndex=0 aria-selected=true jQuery18007183007327795561="12">
<SPAN class="ui-icon ui-icon-triangle-1-s">
</SPAN>
<A class="SelectThis" tabIndex=-1 href="#">
item name
</A>
</H3>
<DIV class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" role=tabpanel>
<A href="#">
Edit Item
</A>
<BR>
<SPAN style="DISPLAY: none">
4900bc3b-a086-4d0c-89b8-09e3724aac8e
</SPAN>
</DIV>
</DIV>
<DIV class=group jQuery18007183007327795561="15">
<H3 aria-expanded=false class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role=tab tabIndex=-1 aria-selected=false jQuery18007183007327795561="13">
<SPAN class="ui-icon ui-icon-triangle-1-e">
</SPAN>
<A class="SelectThis" tabIndex=-1 href="#">
item name
</A>
</H3>
<DIV style="DISPLAY: none" class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" role=tabpanel>
<A href="#">
Edit Item
</A>
<BR>
<SPAN style="DISPLAY: none">
0d59f87e-a294-4f85-beae-a0e266ab6a7e
</SPAN>
</DIV>
</DIV>
</DIV>
</DIV>
</DIV>
.......
现在,在类名"SelectThis".each()
上使用jquery选择器函数来遍历它们中的每一个并读取值。这能解决问题吗?如果没有什么善意的分享你面临的问题是什么。
我建议阅读jquery的选择器文档。http://api.jquery.com/category/selectors/
相关文章:
- JS/jquery:我将如何遍历HTML中的每个图像
- jQuery-数据提取问题(html遍历)
- 循环遍历图像数组并将其显示到HTML页面
- 遍历HTML结构以搜索属性
- 使用jquery循环遍历html页面的所有锚点标记
- JS/jQuery遍历HTML元素以动态构建字符串
- Java 脚本:递归地遍历关联的 HTML 文件的 Dom,并打印遇到的元素类型
- 遍历 html 单元格并在满足条件时执行函数
- 使用 javascript/jquery 遍历包含 HTML 的字符串中的所有标记
- 如何在 JavaScript 中循环遍历 HTML 行并在满足条件时更改背景
- 循环遍历 HTML 内容并将值作为全局变量返回
- 我可以使用 html() 保存动态表单而不是遍历 INPUT 吗?
- Javascript:仅遍历HTML DOM元素
- 遍历 html 模板中的数组字段
- Postorder 使用 JavaScript 或 jQuery 遍历树以创建 HTML 代码
- 遍历对象数组的 json 对象,信任一个键的值作为 Angular 中的 HTML
- 循环遍历 JSON 数据以生成 HTML
- 循环遍历 JSON 中的嵌套数组值,将这些值附加到生成的 html 中
- 使用jQuery遍历HTML
- jQuery通过$(this)遍历HTML