index.jsp代码：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>jquery</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<script type="text/javascript" src="javascript/jquery-1.4.js">
</script>
<script type="text/javascript" src="javascript/elements.js">
</script>
<script type="text/javascript" src="javascript/jqia2.support.js">
</script>
<script type="text/javascript">
function one(){
$('#dimg img').remove();
}
</script>
</head>
<body>
<div id="dimg">
<img src="images/image.1.jpg" id="hibiscus" alt="Hibiscus" />
<img src="images/image.2.jpg" id="littleBear"
title="A dog named Little Bear" />
<img src="images/image.3.jpg" id="verbena" alt="Verbena" />
<img src="images/image.4.jpg" id="cozmo" title="A puppy named Cozmo" />
<img src="images/image.5.jpg" id="tigerLily" alt="Tiger Lily" />
<img src="images/image.6.jpg" id="coffeePot" />
<img src="images/image.6.jpg" id="coffeePot" />
</div>
<div>
<input type="button" onclick="one()" value="button">
</div>
</body>
</html>
运行结果：
点击button按钮之后，效果如下：
- 大小: 18.8 KB
- 大小: 6.5 KB
分享到：
相关推荐
<div id="gallery"> <img src="image1.jpg" alt="Image 1"> <img src="image2.jpg" alt="Image 2"> <!-- 更多图片... --> </div> <script src="jquery.js"> <script src="jquery.gallery4.js"> $...
<div id="qrcode"></div> ``` 3. **调用插件**：在JavaScript中，通过jQuery选择器找到容器并调用qrcode方法，传入必要的参数。 ```javascript $("#qrcode").qrcode({ text: "http://www.example.com", // 需要...
2. **HTML结构**：在页面中创建一个用于选择图片的`<input type="file">`元素，以及用于预览图片的`<div>`或`<img>`元素。这些元素的ID需要与插件的配置项相对应。 3. **初始化插件**：在文档加载完成后，使用...
<div id="imageGallery"> <img src="image1.jpg" alt="Image 1" /> <img src="image2.jpg" alt="Image 2" /> <!-- 更多图片... --> </div> ``` 五、自定义和扩展 PageSwitch插件允许开发者根据需求进行自定义，...
<img src="large.jpg" id="jqZoomLarge" alt="大图"> ``` 在这个例子中，`rel="gal1"`属性用于关联大图和预览图，`jqZoomPup`是放大镜的容器，`jqZoomLarge`是显示大图的元素。 然后，在文档加载完成后，使用...
<div class="exzoom" id="exzoom"> <ul class="exzoom-lens"> <li><img src="path/to/large-image-1.jpg" data-zoom-image="path/to/large-image-1.jpg"> <li><img src="path/to/large-image-2.jpg" data-zoom-...
jQuery提供`data()`方法用于在元素上存储和检索数据，如`$("img").data("src", "newimg.jpg")`将新图片地址存入img元素。 ### 9. 插件系统 jQuery的插件系统扩展了其功能，如jQuery UI提供了更多的用户界面组件，...
<div id="dialog" title="等待效果" style="display:none;"> 正在处理，请稍候... <img src="loading.gif" alt="加载中" /> </div> $(function() { $("#dialog").dialog({ autoOpen: false, modal: true, ...
<div id="droppable" class="ui-widget-content"></div> <div class="draggable ui-widget-content"><img src="image1.jpg" alt="图片1"></div> <div class="draggable ui-widget-content"><img src="image2.jpg...
<div id="slider"> <img src="image1.jpg" alt="Image 1"> <img src="image2.jpg" alt="Image 2"> <img src="image3.jpg" alt="Image 3"> </div> $(document).ready(function() { var slider = $("#slider...
<div id="image-scroll-container"> <div class="image-item"><img src="image1.jpg" alt="Image 1"></div> <div class="image-item"><img src="image2.jpg" alt="Image 2"></div> <!-- 更多图片项... --> </...
<div id="imageGallery"> <img src="image1.jpg" alt="Image 1"> <img src="image2.jpg" alt="Image 2"> <!-- 更多图片... --> </div> $(document).ready(function() { $('#imageGallery').imageGallery(); })...
通常是一个`<div>`元素，使用`id`属性指定为`camera_wrap`。 ```html <div id="camera_wrap"></div> ``` ### 4. CSS样式 jQuery Camera提供了一些默认样式，但你可以根据需求进行自定义。在你的CSS文件中覆盖这些...
<div id="element_id"> 文字说明"><img src="thumb_image3.jpg" width="72" height="72"></a> </div> 调用 lightBox $('#element_id a').lightBox(); // lightBox 的使用范围是根据 jQuery 选择器来设置的，...
本篇文章将深入讲解如何使用jQuery UI Drag插件来创建可拖动的浮动div，并将其应用于布局排列，以及如何将排序结果保存到数据库。 **1. jQuery UI Drag插件介绍** jQuery UI是基于jQuery库的一个扩展，它提供了...
《jQuery MegaMenu 超酷菜单2.1详解》 在网页设计中，导航菜单是不可或缺的一部分，它为用户提供了方便快捷的网站内容访问路径。jQuery MegaMenu 是一款备受推崇的菜单插件，以其强大的功能和酷炫的视觉效果赢得了...
<div id="banner"> <img src="image1.jpg" alt="Image 1"> <img src="image2.jpg" alt="Image 2"> <!-- 更多图片... --> </div> ``` 接下来，我们引入jQuery库，可以使用CDN链接或者将库文件放在本地： ```html...
选择器速度提升 选择器的速度大幅度提高了，下表为jQuery1.1.2和1.1.3的选择器速度对比，提高了8倍多 Browser jQuery 1.1.2 jQuery 1.1.3 % Improvement IE 6 4890ms 661ms 740% Firefox 2 5629ms 567...
<div id="dialog" title="基本提示框">这是一个基础的提示信息。</div> $(function() { $("#dialog").dialog(); }); ``` 2. **自定义提示：使用弹出层和模态** 如果不需要完整的对话框功能，可以利用...
代码片段： <div id="pack"> <div id="sel1"> <img > <img > <img > <img > <img > <img > <img > <img > </div> <div id="sel2"></div> </div>