demo.html
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <p>头部信息</p> <div> <p>阅谁问君诵水落</p> <p>阅谁问君<p>阅谁问君诵水落</p> <p>阅谁问君诵水落</p><p>阅谁问君诵水落诵水落</p> <p>阅谁问君<p>阅谁问君诵水落</p><p>阅谁问君诵水落</p><p>阅谁问君诵水落</p><p>诵水落</p> <p>阅谁问君诵水落</p> <p>阅谁问君诵水落<p>阅谁问君诵水落</p><p>阅谁问君诵水落</p> <script type="text/javascript" src="demo.js"></script> <p>阅谁问君诵水落</p> <p>阅谁问君诵水落</p> <p>阅谁问君诵水落</p> <p>阅谁问君诵水落</p> <p>阅谁问君诵水落<p>阅谁问君诵水落</p><p>阅谁问君诵水落</p> </div> <p>备案信息</p> </body> </html>
demo.js
document.writeln("<div id=\"contSonOnly\">");
document.writeln("<p>内容内容内容内容内容内容内容内容内容</p>");
document.writeln("</div>");
window.onload=function(){
var contSonOnly=document.getElementById("contSonOnly");
var contParent=contSonOnly.parentNode;
var contSonList=contParent.children;
for(var i=0;i<contSonList.length;i++){
if(contSonList[i]!=contSonOnly){
contSonList[i].style.display="none";
}
}
}
效果图：
相关推荐
总的来说，通过JavaScript实现隐藏同级元素并显示JS文件内容的方法，可以有效地控制页面内容的呈现，提供更加灵活和动态的用户体验。同时，这也是一种基础的DOM操作和事件监听技术的运用，对于学习和理解JavaScript...
6. 获取同级元素：$.siblings()，选取元素的所有同级元素，$.siblings("选择器")则只选取特定的同级元素。 7. 获取后续元素：$.next("选择器")，选取元素后面的同级元素，$.nextAll("选择器")选取所有后续同级元素。...
这里，`next`方法选取紧接在当前元素后的同级元素，`:hidden`和`:visible`是jQuery的伪类选择器，用于判断元素是否可见。`slideDown`和`slideUp`则是动画方法，它们分别以滑动效果改变元素的高度，从而达到显示和...
然后，通过JavaScript在网页上的某个元素上触发日历的显示。例如，如果你有一个ID为`calendarButton`的按钮，你可以这样操作： ```javascript var calendar = new Calendar(); // 假设Calendar是插件提供的构造...
- `+`：相邻兄弟选择器，选取紧跟在指定元素后的同级元素。 - `~`：通用兄弟选择器，选取指定元素后面的同级元素。 4. **过滤选择器** - 过滤选择器用于进一步筛选已选中的元素集合，如`:first`、`:last`、`:...
当点击事件触发时，阻止其冒泡，然后查找当前元素的下一个同级元素（即子菜单），根据其`display`样式切换显示状态。 为了实现更丰富的功能，比如异步加载子节点、节点的选中状态、拖放排序等，可以使用专门的...
- **子元素筛选**: `.children()`, `.find()`用于选取子元素，`.siblings()`选取同级元素。 4. **事件处理** - **绑定事件**: `.on()`, `.click()`, `.hover()`等用于添加事件监听器。 - **事件冒泡与阻止**: `....
同理，当内容折叠，它的前一个同级元素会通过`.slideToggle()`方法向上收缩，并且当动画完成时，通过回调函数内的`$("img",$self).attr("src","images/down.gif");`来改变标题后面的图片为“向下”箭头，表示当前...
- $(this).next().parent().siblings().children("div").slideUp(): 隐藏同级`li`元素中其他`div`，实现互斥显示。 2. jQuery二级菜单的显示与隐藏： 第二个示例中，我们看到了一个一级标题和对应子菜单的交互。...
- `Object.toggle(fn1, fn2, ..., fnN)`在多个函数间切换调用，常用于显示和隐藏元素。 10. 交互使用class样式： - `Object.toggleClass("className")`在元素上交替添加或移除指定的class。 11. 显示与隐藏元素： ...
- 解析：选择所有隐藏的`tr`元素，并将它们显示出来。 #### 4.2 可见元素 - **语法**: `$(“:visible”)` - **作用**: 选取所有可见的元素。 - **示例**: ```javascript var input1 = $("tr:visible"); ``` - ...
2. `siblings()`: 获取同级元素。 3. `filter()`, `not()`: 过滤匹配的元素集合。 以上只是jQuery功能的一部分，实际应用中还有更多高级技巧和插件可供使用。在`jquery练习`文件中，你可以找到相关的示例代码，通过...
- `siblings()`：获取当前元素的所有同级元素。 - `parent()`：获取当前元素的直接父元素。 - `closest(selector)`：向上遍历DOM树，找到最近匹配指定选择器的祖先元素。 **DOM操作** jQuery提供了一系列方法来...
`$("ancestor descendant")`选取祖先元素下的子孙元素，`$("parent > child")`选取父元素直接的子元素，`$("prev + next")`选取紧接在前一个元素后面的元素，`$("prev ~ siblings")`选取前一个元素的所有同级元素。...
4. **js**: JavaScript代码文件夹，通常包含实现手风琴效果的jQuery脚本。这些脚本监听用户交互，根据用户点击事件改变菜单的状态，实现内容的展开与隐藏。 5. **index.html**: 主要的HTML文件，包含了手风琴菜单的...
siblings函数用于获取所有同级元素。 文档中还涉及到对CSS样式的操作。在JavaScript中，通过操作元素的style属性来动态改变样式是一种常见做法。例如，setSlideWH函数用于设置元素的宽度和高度，而readStyle函数...
此外，还可以通过`.children()`、`.parent()`、`.siblings()`等方法来获取子节点、父节点或同级元素。 2. 事件处理：jQuery提供了`.on()`方法来绑定事件，例如`$("#button").on("click", function() {...})`用于...