为了账号安全,请及时绑定邮箱和手机立即绑定

【金秋打卡】第十二天 DOM对象

标签:
JavaScript

第一模块:

课程名称:JavaScript进阶篇教程

章节:第九章

讲师名称:慕课官方号

第二模块:

  • 什么是DOM?

文档对象模型DOM定义访问和处理HTML文档的标准方法。DOM 将HTML文档呈现为带有元素、属性和文本的树结构(节点树)。

5375ca7e0001dd8d04830279.jpg


第三模块:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>style样式</title>
</head>
<body>
  <h2 id="con">测试</H2>
  <p class='dom'>dom</p>
  <div>demo_Tag</div>
  <ul>  
        <li title="JS">JavaScript</li>  
        <li title="JQ">JQuery</li>  
        <li title="">HTML/CSS</li>  
        <li title="JAVA">JAVA</li>  
        <li title="">PHP</li>  
      </ul>  
  <script type="text/javascript">
  // 返回带有指定名称的节点对象的集合。
   const con=document.getElementsById('con');
   // 返回带有指定名称的节点对象的集合。
   const obj=document.getElementsByName('dom');
   // 返回带有指定标签名的节点对象的集合。返回元素的顺序是它们在文档中的顺序。
   const domName=document.getElementsByTagName(div);
   // 通过元素节点的属性名称获取属性的值
   const eleNode=document.getAttribute(id);
   // setAttribute() 方法增加一个指定名称和值的新属性,或者把一个现有的属性设定为指定的值。
   var Lists=document.getElementsByTagName("li");
      for (var i=0; i<Lists.length;i++){
        var text = Lists[i].getAttribute("title");
        document.write(text +"<br>");
        if(text=="")
        {
        Lists[i].setAttribute("title","WEB前端技术");
        document.write(Lists[i].getAttribute("title")+"<br>");
        }
      }
  </script>
</body>
</html>

第四模块:

https://img3.sycdn.imooc.com/63666bff000164f710920837.jpg

https://img2.sycdn.imooc.com/63666bd40001669f10920772.jpg



点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消