JQuery查找子元素find()和遍历集合each的方法积累
1.HTML代码
<div name="students" school="HK"> <input type="boy" name="ZhangSan" value="206"> <input type="girl" name="Lisi" value="108"> </div>
2.jquery
<script type="text/javascript"> /* find() 查找子元素方法 */ var aaa = $("div[name='students'][school='HK']").find("input[type='boy'][name='ZhangSan']"); console.log(aaa.val()); /* $(".child",parent); 方法查找子元素*/ var bbb = $($("input[type='boy'][name='ZhangSan']"),$("div[name='students'][school='HK']")); console.log(aaa.val()); /* each()方法遍历数组 */ var arr = [ "one", "two", "three", "four" ]; $.each(arr, function() { console.log(this); }); /* each()方法处理json */ var obj = { one : 1, two : 2, three : 3, four : 4 }; $.each(obj, function(key, val) { console.log(obj[key]); }); /* each()方法处理二维数组 */ var arr1 = [ [ 11, 44, 33 ], [ 4, 6, 6 ], [ 7, 20, 9 ] ] $.each(arr1, function(i, item) { console.log(item[0]); }); /* each()方法处理HTML元素 */ $("div[name='students'][school='HK'] > input").each(function() { console.log($(this).val()); }); </script>
相关推荐
这两个方法分别用于查找子元素和遍历集合。 首先,find() 方法用于在给定的元素集合中查找匹配的后代元素。它只会在给定元素的后代中进行查找,不会考虑当前元素,这与后代选择器有些相似。例如,如果我们想要查找...
jQuery 遍历函数是 jQuery 库中的一组方法,用于筛选、查找和串联元素。这些方法可以帮助开发者快速地操作和处理 HTML 元素。下面是 jQuery 遍历函数的详细介绍: 1. `.add()` 方法:将元素添加到匹配元素的集合中...
它们分别用于映射元素、筛选元素、查找子元素、获取相邻元素等。 - `map()`可以将元素集合转换为新的数组,每个元素都经过特定函数处理。 - `grep()`用于过滤数组,根据给定条件保留或排除元素。 - `filter()`则是...
`find()`方法通过CSS选择器简化了在已选元素内部查找子元素的过程,而`each()`方法则提供了优雅的遍历和操作元素集合的方式。熟练掌握这两个方法,能显著提升jQuery编程的效率和代码质量。在实际开发中,结合使用`...
find()方法用于在匹配的元素集里面寻找子元素。其核心功能是在一个元素集合内查找所有符合指定表达式的后代元素。这通常用于查找一个元素内嵌套的特定标签,可以使用CSS选择器作为参数。例如,如果你想从页面上所有...
`.each()`方法可用于遍历并操作集合中的每个元素,而`.find()`, `.children()`, `.parent()`等方法则用于查找子元素或父元素。 5. **Ajax交互**:jQuery简化了异步数据交换(Ajax)的过程。`.ajax()`, `.get()`, `....
在jQuery中,所有的选择器返回的都是一个对象数组,而遍历函数则是用来遍历这个对象数组的一系列方法。下面我们详细讲解这些jQuery遍历函数的知识点。 .add()函数用于将元素添加到jQuery对象集合中。这个函数可以将...
jQuery 提供了 `children()`、`find()` 和 `next()` 等方法来遍历元素的子节点。在处理表格的递归遍历时,我们通常会结合 `each()` 函数,因为它可以对匹配的元素集合中的每个元素执行一个函数。 以下是一个基本的 ...
- children:获取匹配元素集合中每个元素的直接子元素。 - find:在每个匹配元素的后代元素中查找与指定选择器匹配的元素。 - is:检查当前元素集合中的元素是否匹配给定的选择器。 - next:获取匹配元素集合中...
在本文中,我们将探讨jQuery库中的一系列遍历函数,以及如何使用javascript中的each函数来遍历数组和DOM元素。jQuery是一个快速、小巧且功能丰富的JavaScript库,它简化了HTML文档遍历、事件处理、动画和Ajax交互的...
1. **DOM操作**:jQuery提供了一系列方便的函数来操作DOM元素,如`$("#id")`用于选取指定ID的元素,`.find()`用于查找子元素,`.append()`和`.prepend()`用于在元素内部添加内容。 2. **事件处理**:jQuery简化了...
- **描述**:返回当前匹配元素集合的直接子元素。 3. **检查元素是否包含特定字符串**: - `contains(str)` - **描述**:检查元素的文本内容是否包含指定的字符串。 4. **结束遍历**: - `end()` - **描述**:...
- `.find()`: 在集合中的元素中查找子元素。 - `.is()`: 检查元素是否匹配给定的选择器。 - `.next()`: 获取元素的下一个兄弟元素。 - `.not()`: 排除集合中匹配的元素。 - `.parent()`: 获取元素的直接父元素。 - `...
• 选择符(selector)“查询”和“查找” HTML 元素 • jQuery 的 action() 执行对元素的操作 示例 $(this).hide() - 隐藏当前元素 $("p").hide() - 隐藏所有段落 $("p.test").hide() - 隐藏所有 class="test" 的...
4. **jQuery.contents()**: 这个方法返回元素内的所有内容,包括子元素和文本节点。 5. **jQuery.prev()**: 查找当前元素的前一个兄弟元素。 6. **jQuery.prevAll()**: 返回所有在当前元素之前的兄弟元素。 7. **...
- **查找子元素**: 使用 `.children()` 或 `.find()` 方法。 - **获取或设置属性**: `.attr()` 和 `.removeAttr()` 方法用于添加、删除或修改属性。 - **创建新元素**: 使用 `$("<element>")` 创建新元素,然后通过 ...
- **each()**: 遍历jQuery对象集合,对每个元素执行回调函数。 - **size()**: 返回集合中元素的数量。 - **length**: 等价于`size()`,返回集合的长度。 - **get()**: 获取原始的DOM元素数组或单个DOM元素。 #### ...
- `children()`、`closest()`、`find()`、`next()`、`prev()`等:查找元素的子元素、最近的匹配元素、后代、相邻元素等。 **文档处理** - `append()`、`prepend()`、`insertAfter()`、`insertBefore()`等:元素的...