使用外置js实现对html的页面做一些增删改查的操作

最新推荐文章于 2024-06-15 11:00:00 发布

段振轩

最新推荐文章于 2024-06-15 11:00:00 发布

阅读量4.7k

点赞数 1

分类专栏： H5 文章标签： html

本文链接：https://blog.csdn.net/qq_31927785/article/details/72545663

版权

H5 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

其实在之前的代码中，我们已经实现用js，对原来的js的页面进行一些动态的操作，这次我将用外置的js来实现这些操作;

外置js只需要在html页面中获取js文件即可

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JS的CRUD</title>

    <!--//外部引入的js;-->

    <script src="index.js"></script>


</head>
<body>
    <div id="main">
        <p>我是描述图片的</p>



    </div>

</body>
</html>

上面是html页面中我仅仅引入js,下面的js文件中我将js做一些操作
其实原理中，在js中获取到标签或者页面，然后获取到这个标签做一个增删改查的操作；

//
// 增--往网页中写东西；
   document.write('helloworld');

   //拿到div;
  var main = document.getElementById('main');
  console.log(main);
  //创建图像标签;
  var img = document.createElement('img');
  img.src = 'img/dkls.png';
  main.appendChild(img);

  //删除;
  img.remove();
  //查；getElementBy 等四种方式；

查就是我们经常用到的，获取标签，通常通过id，或者通过name等四种方式，这里就不做过多的演示。

var img = document.getElementsByName(‘icon’)[0];
var pre = document.getElementsByTagName(‘button’)[0];

  var next = document.getElementsByTagName('button')[1];

段振轩

关注

1
点赞
踩
7

收藏

觉得还不错? 一键收藏
0
评论
使用外置js实现对html的页面做一些增删改查的操作

其实在之前的代码中，我们已经实现用js，对原来的js的页面进行一些动态的操作，这次我将用外置的js来实现这些操作;外置js只需要在html页面中获取js文件即可<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>js中常用的事件</title></head><body> <img src
复制链接

扫一扫

专栏目录