它的JS与HTML标签是分离的吗

Ku_Andrew 发布于2019-08-01 17:10 / 3344人阅读

一个单的利用JS切换图片的功能

写法1：

  
      JS切换图片
      
        
        
        
        
    
    图片描述
    
    
    
      function showPic(whichpic){
      //改变图片
    var source =  whichpic.getAttribute("href");
    var placeholder=document.getElementById("placeholder");
    placeholder.setAttribute("src",source);
    //改变图片描述
    function showPic_description(){
      var text=whichpic.getAttribute("title");
      var pic_desciption=document.getElementById("pic_desciption");
      pic_desciption.childNodes[0].nodeValue=text;
    };
  };

写法2：


      JS切换图片
      
        
        
        
        
    
    图片描述
    
    
    
    window.onload=prepareGallery;
function prepareGallery(){
  //找到图片集
  var gallery=document.getElementById("img_gallert");
  // 图片集的a元素节点
  var link=gallery.getElementsByTagName("a");
  // 遍历节点
  for(var i=0;i
虽然功能都一样，但是写法2却更好JS不会因为HTML里的代码改变了，就导致无法执行。
好的JS应该与HTML标签是分离的。后期维护更加方便

专线服务混合云 ecs云服务器是彼此分离的吗 html5元素与标签 html标签的颜色是 html的新标签是

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/50992.html

它的JS与HTML标签是分离的吗

一个单的利用JS切换图片的功能showImg(https://segmentfault.com/img/bVQTPa?w=1094&h=748);写法1： JS切换图片图片描述 function showPic(whichpic){ ...

StonePanda 2019-08-20 18:00 评论0 收藏0
[译] 逐渐去掌握 React（作为一名 Angular 开发者）

摘要：你是一个对感兴趣的开发者吗不用担心，这真的不会让你成为一个背叛者或其他什么，真的。事实上，这个想法并不是或独创的它只是一种很棒的软件开发实践方式。把代码分离到不同的文件里并不会自动导致关注点分离。原文链接 : Getting to Grips with React (as an Angular developer)原文作者 : DAVE CEDDIA译者 : 李林璞（web前端领域）...

channg 2019-08-21 14:07 评论0 收藏0
React 可视化开发工具 Shadow Widget 非正经入门（之二：分离界面设计）

摘要：本篇讲解转义标签投影定义，这几项与如何分离界面设计有关。找一个替代品如上一篇非正经入门之一所述，要克服浆糊的不利影响，要找一个替代品。本文完本专栏历史文章介绍一项让可以与抗衡的技术可视化开发工具非正经入门之一三宗罪本系列博文从 Shadow Widget 作者的视角，解释该框架的设计要点。本篇讲解转义标签、json-x、投影定义，这几项与如何分离界面设计有关。 1. 找一个 ...

Carl 2019-08-21 11:44 评论0 收藏0
前端面试宝典

摘要：优雅降级观点优雅降级观点认为应该针对那些最高级最完善的浏览器来设计网站。面试官希望听到是。在前端构建中应该考虑微格式吗微格式是一种让机器可读的语义化词汇的集合，是结构化数据的开放标准。一、HTML和CSS 你做的页面在哪些流览器测试过？这些浏览器的内核分别是什么?IE: trident内核Firefox：gecko内核Safari:webkit内核Opera:以前是presto内核...

ChanceWong 2019-08-29 12:31 评论0 收藏0