js之前有看过,只不过是在C++代码中通过UI引擎调用js进行画图,当时就为语法问题痛苦了半天,结果现在java web了,更是处处是js,再次陷入痛苦中.

js实际例子:

<!DOCTYPE html>

<html>

<head>

<script>

     




    function displayDate()




   {




      document.getElementById("demo").innerHTML=Date();




   }


</script>

</head>

<body>

 

<h1>我的第一个 JavaScript 程序</h1>

<p id="demo">这是一个段落</p>

 

<button type="button" onclick="displayDate()">显示日期</button>

 

</body>

</html>

 

为什么学习 JavaScript?

JavaScript web 开发人员必须学习的 3 门语言中的一门：

  1. HTML 定义了网页的内容
  2. CSS 描述了网页的布局
  3. JavaScript 网页的行为

 

JS中一个简单输出的代码:

<!DOCTYPE html>

<html>

<body>

 

<p>

JavaScript 能够直接写入 HTML 输出流中：

</p>

 

<script>

document.write("<h1>这是一个标题</h1>");

document.write("<p>这是一个段落。</p>");

</script>

 

<p>

您只能在 HTML 输出流中使用 <strong>document.write</strong>。

如果您在文档已加载后使用它（比如在函数中），会覆盖整个文档。

</p>

 

</body>

</html>

效果截图:

 

JS事件:

<!DOCTYPE html>

<html>

<body>

 

<h1>我的第一个 JavaScript</h1>

 

<p>

JavaScript 能够对事件作出反应。比如对按钮的点击：

</p>

 

<button type="button" onclick="alert('欢迎!')">点我!</button>

 

</body>

</html>

 

JavaScript:改变Html内容:

<!DOCTYPE html>

<html>

<body>

 

<h1>我的第一段 JavaScript</h1>

 

<p id="demo">

JavaScript 能改变 HTML 元素的内容。

</p>

 

<script>

function myFunction()

{

x=document.getElementById("demo");  // 找到元素

x.innerHTML="Hello JavaScript!";    // 改变内容

}

</script>

 

<button type="button" onclick="myFunction()">点击这里</button>

 

</body>

</html>

 

改变图像:

<!DOCTYPE html>

<html>

<body>

<script>

function changeImage()

{

element=document.getElementById('myimage')

if (element.src.match("bulbon"))

  {

  element.src="/images/pic_bulboff.gif";

  }

else

  {

  element.src="/images/pic_bulbon.gif";

  }

}

</script>

 

<img id="myimage" onclick="changeImage()"

src="/images/pic_bulboff.gif" width="100" height="180">

 

<p>点击灯泡就可以打开或关闭这盏灯</p>

 

</body>

</html>

JavaScript：改变 HTML 样式

<!DOCTYPE html>

<html>

<body>

 

<h1>我的第一段 JavaScript</h1>

 

<p id="demo">

JavaScript 能改变 HTML 元素的样式。

</p>

 

<script>

function myFunction()

{

x=document.getElementById("demo") // 找到元素

x.style.color="#ff0000";          // 改变样式

}

</script>

 

<button type="button" onclick="myFunction()">点击这里</button>

 

</body>

</html>

疯狂学习java web3(javaScript)的更多相关文章

  1. 疯狂学习java web

    因工作需要,疯狂学习java web,只是这么多年一直从事C++开发,突然之间要接手同事的那么一大堆代码,真有无从下手的感觉,首先是要学习html,然后是js, 然后是jsp,当然还有各种框架,想想就 ...

  2. 疯狂学习java web5(SSI框架)

    其实前面的所有只是铺垫,目的只是为了了解现有工程是怎样的.之前直接上来就看,看了很久依然是云里雾里,所以不得已学习点基础知识,前面的基础只是蜻蜓点水一带而过,希望能起部分作用了. 发现struct2有 ...

  3. 疯狂学习java web4(jsp)

    JSP与PHP.ASP.ASP.NET等语言类似,运行在服务端的语言. JSP(全称Java Server Pages)是由Sun Microsystems公司倡导和许多公司参与共同创建的一种使软件开 ...

  4. 疯狂学习java web2(css)

    CSS应该是样式描述的意思,定义如下: 什么是 CSS? CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 ...

  5. 《疯狂Java讲义》（一） ---- 关于学习Java的反思

    "听到Spring很火,就立马买来一本Spring的书来读,最后结果往往是失败,因为这种学习没有积累,没有根基,学习过程中困难重重,每天都被一些相同.类似的问题所困扰,起初热情十足,经常上论 ...

  6. 30个深度学习库：按Python、C++、Java、JavaScript、R等10种语言分类

    30个深度学习库:按Python.C++.Java.JavaScript.R等10种语言分类 包括 Python.C++.Java.JavaScript.R.Haskell等在内的一系列编程语言的深度 ...

  7. 从Java和JavaScript来学习Haskell和Groovy

    直击现场 记得刚接触计算机的时候,我就受到了两个非常巨大的错误观念的影响,这个观念最初是来自于老师的传授还是学长的教诲已经记不清了,但是直到我工作几年以后,才慢慢有了实际的体会: 学习和使用什么编程语 ...

  8. Json学习总结（1）——Java和JavaScript中使用Json方法大全

    摘要:JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.它基于ECMAScript的一个子集. JSON采用完全独立于语言的文本格式,但是也使用了类似于C语 ...

  9. 零基础如何系统学习Java Web

    零基础如何系统学习Java Web?   我来给你说一说 你要下决心,我要转行做开发,这样你才能学成. 你要会打字,我公司原来有一个程序员,打字都是两个手一指禅,身为程序员你一指禅怎么写出的代码,半个 ...

随机推荐

  1. bzoj3721

    不是说好的20s吗,怎么我19s都超时……逗我最后还得写成c++才能过……首先不难发现询问肯定是O(1)的复杂度我们先把奇数和偶数分开排序,不难发现几个性质1. 奇数的个数一定是奇数2. 奇数选取随k ...

  2. 【线段树】BAPC2014 E Excellent Engineers (Codeforces GYM 100526)

    题目链接: http://codeforces.com/gym/100526 http://acm.hunnu.edu.cn/online/?action=problem&type=show& ...

  3. QTP关于AOM的Javascript启动方式

    序 QTP的AOM模型想必大家都很熟悉了,平时常用的就是通过VBS脚本的方式编写启动程序(也是我现在用的方法).其实,还有很多其他的方式,如Java,C#,JS,这些语言都是通过调用QTObjectM ...

  4. ActionFilterAttribute OnActionExecuting 获取参数

    public class AuthFilterAttribute : ActionFilterAttribute { /// <summary> /// Action执行前处理 /// & ...

  5. bzoj 3572 [Hnoi2014]世界树（虚树+DP）

    3572: [Hnoi2014]世界树 Time Limit: 20 Sec  Memory Limit: 512 MBSubmit: 645  Solved: 362[Submit][Status] ...

  6. poj1016

    题目大意:数据统计 看明白了,就是给你一个数,例如31123314,代表的意思有3个1,1个2,3个3,1个4,但数字本身的有的数字也是有3个1,1个2,3个3,1个4,所以这样的数叫做self-in ...

  7. Solr使用solr4J操作索引库

    Solrj是Solr搜索服务器的一个比较基础的客户端工具,可以非常方便地与Solr搜索服务器进行交互.最基本的功能就是管理Solr索引,包括添加.更新.删除和查询等.对于一些比较基础的应用,用Solj ...

  8. 关于openoffice英文乱码的问题

    首先选中乱码的部分,然后在右边的侧栏中看到其字体,尝试改变它的字体,看会不会显示正常,如果可以,先记住这两种字体.然后:    工具->选项->字体        然后在使用替换表打上勾, ...

  9. Hadoop 的子项目

    Hadoop Common: 在0.20及以前的版本中,包含HDFS.MapReduce和其他项目公共内容,从0.21开始HDFS和MapReduce被分离为独立的子项目,其余内容为Hadoop Co ...

  10. android scrollview组件禁止滑动的方法

    xml配置:           android:id="@+id/sc_freement"             android:layout_width="fill ...