JavaScript 库
JavaScript
库 - jQuery、Prototype、MooTools。
jQuery
jQuery 是目前最受欢迎的 JavaScript 框架。
它使用 CSS 选择器来访问和操作网页上的 HTML 元素(DOM 对象)。
jQuery 同时提供 companion UI(用户界面)和插件。
CDN -内容分发网络
您总是希望网页可以尽可能地快。您希望页面的容量尽可能地小,同时您希望浏览器尽可能多地进行缓存。
如果许多不同的网站使用相同的 JavaScript 框架,那么把框架库存放在一个通用的位置供每个网页分享就变得很有意义了。
CDN (Content Delivery Network) 解决了这个问题。CDN 是包含可分享代码库的服务器网络。
但是由于 Google 在中国经常被GFW(*,英文名称Great Firewall of China,简写为Great Firewall,缩写GFW)屏蔽,造成访问不稳定,所以建议使用百度静态资源公共库。
如需在您的网页中使用 JavaScript 框架库,只需在 <script> 标签中引用该库即可:
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js">
</script>
JavaScript - 测试 jQuery
引用 jQuery、jQuery 描述(主要的
jQuery 函数是 $() 函数(jQuery 函数)。如果您向该函数传递 DOM 对象,它会返回 jQuery 对象,带有向其添加的 jQuery 功能。jQuery 允许您通过 CSS 选择器来选取元素。)、
基础 JavaScript 实例
<p>如果时间早于 20:00,会获得问候 "Good day"。</p> <button onclick="myFunction()">点击这里</button> <p id="demo"></p> <script> function myFunction(){ var x=""; var time=new Date().getHours(); if (time<20){ x="Good day"; } document.getElementById("demo").innerHTML=x; } </script>
<p>点击按钮查看输入的对话框。</p> <button onclick="myFunction()">点我</button> <p id="demo"></p> <script> function myFunction(){ var x; var person=prompt("请输入你的名字","Harry Potter"); if (person!=null && person!=""){ x="你好 " + person + "! 今天感觉如何?"; document.getElementById("demo").innerHTML=x; } } </script>
<body> <img src ="planets.gif" width ="145" height ="126" alt="Planets" usemap="#planetmap" /> <map name="planetmap"> <area shape ="rect" coords ="0,0,82,126" onmouseover="writeText('太阳和气体巨星类似木星是太阳系中最大的物体。')" href ="sun.htm" target ="_blank" alt="Sun" /> <area shape ="circle" coords ="90,58,3" onmouseover="writeText('从地球上很难研究水星,因为它太接近太阳。')" href ="mercur.htm" target ="_blank" alt="Mercury" /> <area shape ="circle" coords ="124,58,8" onmouseover="writeText('至到1960年,金星经常被认为是地球的孪生妹妹,因为金星是最靠近我们的行星,并且两个行星有很多相似的特点。')" t')" href ="venus.htm" target ="_blank" alt="Venus" /> </map> <p id="desc">鼠标在太阳和星星上移动,可以看到不同的描述。</p>
var txt=""; function message(){ try{ adddlert("Welcome guest!"); } catch(err){ txt="本页有一个错误。\n\n"; txt+="单击确定继续跳转\n"; txt+="或者单击取消返回\n\n"; if(confirm(txt)){ document.location.href="//www.runoob.com/"; } } }
<script> onerror=handleErr; var txt=""; function handleErr(msg,url,l){ txt="该页面有一个错误\n\n"; txt+="错误: " + msg + "\n"; txt+="URL: " + url + "\n"; txt+="行: " + l + "\n\n"; txt+="点击确定继续。\n\n"; alert(txt); return true; } function message(){ adddlert("Welcome guest!"); } </script>