web开发之js学习（一）

最新推荐文章于 2022-09-28 08:46:55 发布

KSH_Wu

最新推荐文章于 2022-09-28 08:46:55 发布

阅读量314

点赞数

分类专栏： web

本文链接：https://blog.csdn.net/KSH_Wu/article/details/53089018

版权

web 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

学习完了HTML和CSS之后，马上又学习了JS，发现其实也没有多少内容，之前有编程基础，所以学起来也比较轻松，这里打算做个总结吧。（学习网址点击打开链接）

首先呢，来感受下JS的流行力吧：

JavaScript 是属于网络的脚本语言！

JavaScript 被数百万计的网页用来改进设计、验证表单、检测浏览器、创建cookies，以及更多的应用。

JavaScript 是因特网上最流行的脚本语言。（转自w3school原话）

总之呢一句话就是JS让网页变得更加充满活力，充满创造力，是web的未来，简单易学习也是JS流行的一个主要原因（感觉学过c的童鞋两个小时就能看完JS的全部

）。

好啦，言归正传，看看JS的主要内容有哪些。

（一）第一个当然是在HTML里的表现形式是怎么样的？？

首先我们学过html知道有标签这个概念，比如head，body呀，JS也是通过写入标签里然后通过html输出的。这个标签就是<script></script>,那么通过什么写入这个标签里面呢？document.write()（这里关于document.write会覆盖原文档流的理解会单独写一篇文章）即可实现，实例是接受最快的途径（一定要自己敲一遍加深记忆！！！！！）：

<span style="font-size:14px;"><!DOCTYPE html>
<html>
<head>这是我学习JS的第一个实例</head>
<body>
<h1>将JS直接写入HTML文档输出流中</h1>
<span style="color:#FF0000;"><script>
document.write("<h2>地点：哈工大c栋</h2>");
document.write("<p>时间是11月8号</p>");
</script></span>
</body>
</html></span>

很简单，整体格式就是之前学过的HTML标准格式，只不过JS通过document.write()写入到html里面而已，也就是说JS就是用来丰富操作HTML而产生的一种工具，下面是网页显示结果。

结果：

（二）写入进去了之后，那么怎么体现JS强有力的交互性的？

这里我们看一个比较长的脚本，多接触点东西：

<!DOCTYPE html>
<html>
<head>这个脚本包括找错，写入，交互很多功能</head>
<script>                                        <span style="color:#FF0000;">//（注意一下，这是JS的一种注释格式,下面是是第二种注释方法）插入JS</span>   
function myFunction()          
<span style="color:#000099;">{</span>
<span style="color:#FF0000;">try</span>                               <span style="color:#FF0000;"> //加入了查找错误的功能。try，catch
{</span>
var x=<span style="background-color: rgb(255, 0, 0);">document.getElementById("demo").value;</span>  
 <span style="color:#FF0000;">
<span style="color:#990000;">/*</span></span><span style="color:#990000;">这个语句基本上是公式了，千万要注意大小写，JS对大小写很敏感的哦，意思是找到id为demo下元素
的值然后赋给变量x,var这里是JS默认定义变量，变量的类型有数字，布尔型，字符串。*/ </span>    

if (x=="")  <span style="color:#FF0000;">throw</span> "该值为空";
if (x>10)  throw "太大啦"；
if (x<2)    throw "太小啦"；
if  (isNaN(x))  throw "不符合格式要求"；
if (x==5)  throw "bingo,你猜对了对了"
}
}
<span style="color:#FF0000;">catch(err)</span>
{
var y=document.getElementById("mess");    <span style="color:#FF0000;"> //如果没找到这个值的话，那么久写入下面的字符串</span>
y.innerHTML="+err+".";
}
</script>
<h1>其实很多语法和c以及python都如出一辙，学起来很快的</h1>
<p>请猜一个数：</p>
<input id="demo" type="text">
<button οnclick="myFunction">猜数吧！</button>
<span style="color:#FF0000;"><p id="mess"></p></span>    <span style="color:#000099;">//这条语句可千万不要忘了，没输入之前是空的，但是一旦有输出结果了会有相应的输出提示，看下面结果里的图片就知道了。</span>
</body>
</html>

结果：

总结：凡事都是按照套路出牌的，从上面的实例可以学到很多东西。

KSH_Wu

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
web开发之js学习（一）

学习完了HTML和CSS之后，马上又学习了JS，发现其实也没有多少内容，之前有编程基础，所以学起来也比较轻松，这里打算做个总结吧。（学习网址点击打开链接）首先呢，来感受下JS的流行力吧：JavaScript 是属于网络的脚本语言！JavaScript 被数百万计的网页用来改进设计、验证表单、检测浏览器、创建cookies，以及更多的应用。JavaScript 是因特网上
复制链接

扫一扫