js中如何删掉图片添加新图片

2025-04-06 18:15:13

1、<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title></title> <style type="text/css"> Image { width:100px; height:100px; } </style> <script type="text/javascript"> function chuangjian() {

js中如何删掉图片添加新图片

2、 //添加图片 var array = ['1.门钙蹲茌jpg', '2.jpg&垆杪屑丝#39;, '3.jpg', '4.jpg', '5.jpg', '6.jpg', '7.jpg', '8.jpg', '9.jpg', '10.jpg', '11.jpg', '12.jpg', '13.jpg', '14.jpg', '15.jpg' ]; //alert(array.length); var tablenode = document.createElement('table'); var tbody = document.createElement('tbody'); tablenode.setAttribute('width', '600px'); tablenode.setAttribute('height', '400px'); tablenode.setAttribute('border', '2px'); var count = 0;

js中如何删掉图片添加新图片

3、for (var i = 0; i < 3; i++) { var trnode = document.creat髫潋啜缅eElement('tr'); for (var j = 0; j < 5; j++) { var tdnode = document.createElement('td'); var imgnode = document.createElement('img'); imgnode.setAttribute('src', 'picture/' + array[count]); tdnode.appendChild(imgnode); trnode.appendChild(tdnode); count++; } tbody.appendChild(trnode); } tablenode.appendChild(tbody); document.body.appendChild(tablenode); }

js中如何删掉图片添加新图片

4、// 2.删除第3行第2列的图片 function shanchu() { var oldnode = document.getElementsByTagName('img')[11]; oldnode.parentNode.removeChild(oldnode) } </script></head><body><input type="button" value="创建相册" onclick="chuangjian();" /><input type="button" value="替换图片" onclick="tihuan();" /><input type="button" value="删除节点" onclick="shanchu();" /></body></html>

js中如何删掉图片添加新图片

5、 下图为点击创建相册后所呈现页面效果。

js中如何删掉图片添加新图片

6、 然后点击页面上方替换图片选项,替换页面中指定位置的图片,如下图所示。

js中如何删掉图片添加新图片

7、点击页面上方的“删除节点”选项,删除页面中指定位置的图片的节点,如下图所示。

js中如何删掉图片添加新图片
声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢