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="element_id"> 文字说明"><img src="thumb_image3.jpg" width="72" height="72"></a> </div> 调用 lightBox $('#element_id a').lightBox(); // lightBox 的使用范围是根据 jQuery 选择器来设置的,...
选择器速度提升 选择器的速度大幅度提高了,下表为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="pack"> <div id="sel1"> <img > <img > <img > <img > <img > <img > <img > <img > </div> <div id="sel2"></div> </div>
代码片段: <div class="pic"> <div id="box"> <img > <img > <img > <img > <img > <img > <img > <img > <img > </div> <div id="output"> <img > </div> </div>
<div id="stop">Stop here</div> <div></div> <div></div> <div></div> jQuery 代码: $("button").click(function () { $("div").each(function (index, domEle) { // domEle == this $(domEle).css(...
<div id="imgContainer" style="margin-left:auto;margin-right:auto;margin-top:5px;display:none;"> <a href="" target="_blank" title=""><img src="" title="" /> ...... </div> 2. 导入jquery包...
jquery 上传图片前预览,就只是一个JS文件,使用也简单 <!... <html> <head > 图片预览</title> ... charset=UTF-8"> ... <div id="imgDiv"> </div> </div> </form> </body> </html>
<div class="pre-2"> <img /> </div> <div class="pre-3"> <img /> </div> </div> </div> </div> [removed] [removed] [removed] [removed] [removed] [removed] <div 0; font:normal 14px/24...
(答案见下载资源) 上机任务1 ... 在chrome的控制台中输入jQuery...为某dom元素应用某css样式可以使用jQuery中的addClass方法,例如:将id为tt的div元素应用.bt样式,可用些语句:$("#tt").addClass("color","red");
<!...<...<head> <... charset=gb2312" /> [removed][removed] [removed][removed] ... <div id="playerNav"></div> </div> </div> <div solid red;float:left;"> </div> </body> </html>
jquery新闻图片切换 <DIV id="banner" class="banner"> <DIV id="banner_bg" class="banner_bg"></DIV> ...target="_blank"><IMG alt="4牡丹花开富贵图4" src="jquery新闻图片切换_files/4.jpg"></A></DIV> </DIV>
<a href="iphone.jpg" title="jquery.flyout"><img src="iphone_small.jpg" alt="iphone" /></a> </div> 三,Javascript部分(jQuery插件jQuery Image Flyout弹出图片调用) [removed] <!-- $(function() { $...
这又是一款基于jQuery的焦点图插件,前面我们也分享过很多优秀的jQuery焦点图应用插件,有兴趣的朋友可以前往看看。今天介绍的这款jQuery焦点图插件的图片是水平滑动的,三张图片同时滑动有一种视差效果的感觉,并且...
<div id="sliderContainer"> <div id="prev" class="arrow"></div> <div id="slider"> <div class="slide"> <div class="slideCopy"> </div> <img > </div> <div class="slide"> <div ...
<li id="pic2" style="display:none"><a href="http://www.vihchina.net" target="_blank" class="pic"><img src="images/2.jpg" /></a><a href="http://www.vihchina.net" target="_blank" class="txt">俄大火...
<div id="container" tcc-rotation="0"> <item><img > <item><img > <item><img > <item><img > <item><img > <item><img > </div> <nav class="tc-btn-container"> <div class="tc-next">NEXT</div> ...
焦点图相当普通,一共可以循环播放4张图片,并且每一张图片在切换的时候都是向下滑动的切换效果,并且在向下切换时产生弹性的动画特效,另外,插件是基于jQuery的,各种浏览器的兼容性应该还不错。 下面是实现这款...
<div id="fb-root"></div> <section id="exemple" class="container"> <div class="wrap small-width"> <div id="try"></div> <ul id="box-container"> <img > <img > <img > ...
$("div#intro .head") id="intro" 的 <div> 元素中的所有 class="head" 的元素 三. jQuery 事件函数 jQuery 事件处理方法是 jQuery 中的核心函数。 事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。术语...