js如何使用文档就绪函数动态改变页面内容

发布时间:2021-04-21 14:15:15 作者:小新
来源:亿速云 阅读:227

这篇文章主要介绍js如何使用文档就绪函数动态改变页面内容,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

JS是什么

JS是JavaScript的简称,它是一种直译式的脚本语言,其解释器被称为JavaScript引擎,是浏览器的一部分,主要用于web的开发,可以给网站添加各种各样的动态效果,让网页更加美观。

具体如下:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <script>
    /*文档就绪函数*/
    /*动态修改网页的内容*/
    window.onload = function () {
      var d = document.getElementById('d');
      //添加文本信息
      d.innerHTML="hhhh";//添加文本信息或者标签
     // d.innerText="kkkk";//添加文本信息
      var abc = document.getElementsByName("abc");
      //通过数组下标得到对应元素
      abc[0].innerText='sssss'
      //通过标签名字得到
      var span = document.getElementsByTagName('span');
      span[0].innerText='fffff'
      //通过classname找对应元素
      var c=document.getElementsByClassName('c');
      for (var i = 0;i<c.length;i++ ){
        c[i].innerText='买买买'
      }
    }
  </script>
</head>
<body>
<div id="d"></div>
<a href="js1.html" rel="external nofollow" name="abc">啦啦啦啦</a>
<span>
</span>
<p class="c">坎坎坷坷</p>
<p class="c">坎坎坷坷</p>
</body>
</html>

运行效果:

js如何使用文档就绪函数动态改变页面内容

以上是“js如何使用文档就绪函数动态改变页面内容”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注亿速云行业资讯频道!

推荐阅读:
  1. 使用Vue.js怎么实现点击切换按钮改变内容
  2. JS如何实现获取word文档内容并输出显示到html页面

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

js

上一篇:vue.js如何使用v-model实现父子组件间的双向通信

下一篇:css如何设置文字超出省略号

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》