这是我参加「第五届青训营 」伴学笔记创造活动的第 1 天

JavaScript编写办法

第一种编写办法(HTML行内)

<body>
 <a href="javascript:alert('百度一下')" onclick="alert('点击百度一下')">百度一下</a>
</body>

如图所示,咱们把js代码写到了a标签中,在咱们之前的学习过程中,咱们习惯于在body体内书写咱们所需求的html代码,这种办法尽管可行,可是过于臃肿,并且不利于他人阅览,在咱们的潜意识中,a标签所包含的内容应为超链接,将js代码嵌入a标签中难免有种僵硬感,不引荐(可运行)

第二种编写办法(script标签中)

<body>
<a href="#" class="google">Google一下</a>
<script>
 const googleEl = document.querySelector('.google')
 googleEl.onclick = function(){
  alert('Google一下')
  }
</script>
</body>

如图所示,相对于第一种书写办法来说,第二种较为明晰,很好的通过script标签html部分js内容分离隔,使得读者在阅览源代码时分相对舒畅一点。对于初学者而言,此办法比较好;咱们眼光放长远一点,以后写大项意图时分,假如仍是将js代码内嵌在html页面中的话,整篇页面的代码长度过长,不利于读者的阅览,不引荐(可运行)

第三种编写办法(外部的script文件)

day01-复习JavaScript基础语法 | 青训营笔记

day01-复习JavaScript基础语法 | 青训营笔记

如图所示,相对于前两种代码风格来看,第三种办法将js代码单独用一个文件来进行书写。这样书写的优点是:① 代码全体界面不至于臃肿便于后期保护项目,读者能够通过alt+鼠标左键快速检查js文件,作者比较引荐此办法

< noscript >标签

问题

有些用户的阅览器版本过低,比方前期的IE阅览器,无法对js标签解析,咱们如何告知用户是阅览器的问题而并非是咱们网站的问题呢?

思路

  • 针对前期阅览器不支持JavaScript的问题,咱们需求一个高雅降级的处理方案
  • <noscript>标签应运而生,用于不支持JavaScript一个页面提示内容

触发流程

<body>
<noscript>
 <p>您的阅览器不支持或已经关闭运行JavaScript</p>
</noscript>
</body>

下面以Google为例,展现在阅览器中关闭JavaScript的当地

day01-复习JavaScript基础语法 | 青训营笔记