你的位置:首页 > 软件开发 > Java > JavaScript基础(.....持续待更)

JavaScript基础(.....持续待更)

发布时间:2017-04-24 00:00:24
javascript入门一、你知道,为什么JavaScript非常值得我们学习吗?1. 所有主流浏览器都支持JavaScript。2. 目前,全世界大部分网页都使用JavaScript。3. 它可以让网页呈现各种动态效果。4. 做为一个Web开发师,如果你想提供漂亮的网页、令用户 ...

JavaScript基础(.....持续待更)

javascript入门

一、你知道,为什么JavaScript非常值得我们学习吗?

1. 所有主流浏览器都支持JavaScript。

2. 目前,全世界大部分网页都使用JavaScript。

3. 它可以让网页呈现各种动态效果。

4. 做为一个Web开发师,如果你想提供漂亮的网页、令用户满意的上网体验,JavaScript是必不可少的工具。

二、易学性

1.学习环境无外不在,只要有文本编辑器,就能编写JavaScript程序。

2.我们可以用简单命令,完成一些基本操作。

三、从哪开始学习呢?

学习JavaScript的起点就是处理网页,所以我们先学习基础语法和如何使用DOM进行简单操作。

 如何插入JS

1.使用<script>标签在HTML网页中插入JavaScript代码。注意, <script>标签要成对出现,并把JavaScript代码写在<script></script>之间。

<script type="text/javascript">表示在<script></script>之间的是文本类型(text),javascript是为了告诉浏览器里面的文本是属于JavaScript语言。JavaScript基础(.....持续待更)

 

2.可以把HTML文件和JS代码分开,并单独创建一个JavaScript文件(简称JS文件),其文件后缀通常为.js,然后将JS代码直接写在JS文件中。

注意:在JS文件中,不需要<script>标签,直接编写JavaScript代码就可以了。

JS文件不能直接运行,需嵌入到HTML文件中执行,我们需在HTML中添加如下代码,就可将JS文件嵌入HTML文件中。   <script src='/images/loading.gif' data-original="script.js"></script>

  注意: javascript作为一种脚本语言可以放在html页面中任何位置,但是浏览器解释html时是按先后顺序的,所以前面的script就先被执行。比如进行页面显示初始化的js必须放在head里面,因为初始化都要求提前进行(如给页面body设置css等);而如果是通过事件调用执行的function那么对位置没什么要求的。

定义变量使用关键字var,语法如下:

var 变量名

 DOM操作

 认识DOM

文档对象模型DOM(document Object Model)定义访问和处理HTML文档的标准方法。DOM将HTML文档呈现为带有元素,属性,和文本的树结构(节点树)。

JavaScript基础(.....持续待更)

将html代码分解为DOM节点层次图:

JavaScript基础(.....持续待更)   HTML文档可以说由节点构成的集合,三种常见的DOM节点:

1. 元素节点:上图中<html>、<body>、<p>等都是元素节点,即标签。

2. 文本节点:向用户展示的内容,如<li>...</li>中的JavaScript、DOM、CSS等文本。

3. 属性节点:元素属性,如<a>标签的链接属性href="http://www.baidu.com"。

通过ID获取元素

网页由标签将信息组织起来,而标签的id属性值是唯一的,就像是每人有一个身份证号一样,只要通过身份证号就可以找到相对应的人。那么在网页中,我们通过id先找到标签,然后进行操作。

语法:document.getElementById(“id”)

结果:null或[object HTMLParagraphElement]

注:获取的元素是一个对象,如想对元素进行操作,我们要通过它的属性或方法。

 innerHTML 属性

innerHTML 属性用于获取或替换 HTML 元素的内容。

语法:   Object.innerHTML

注意: 1.Object是获取的元素对象,如通过document.getElementById("ID")获取的元素。

        2.注意书写,innerHTML区分大小写。

我们通过id="con"获取<p> 元素,并将元素的内容输出和改变元素内容,代码如下:

<body><h2 id="con">javascript</H2>  //修改后变为hello world<p> JavaScript是一种基于对象、事件驱动的简单脚本语言,嵌入在HTML文档中,由浏览器负责解释和执行,在网页上产生动态的显示效果并实现与用户交互功能。</p><script type="text/javascript"> var mychar=document.getElementById("con")      ; document.write("原标题:"+mychar.innerHTML+"<br>"); //输出原h2标签内容  mychar.innerHTML="Hello world" document.write("修改后的标题:"+mychar.innerHTML); //输出修改后h2标签内容</script></body>

原标题:JavaScript基础(.....持续待更)

关键词:JavaScript

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。