javaScript DOM 编程艺术(一)

84 阅读2分钟

前言:今天是学习这本书的第一天,记录一下每天的学习内容,勉励自己坚持下去!

今天主要了解到的是DOM(doctment object model),文档对象模型。早期,各家浏览器厂商使用各自的标准定义文档,造成了前端开发人员极大的不便。于是W3C制定了一些列标准,包括结构(可扩展标记语言xml、可扩展超文本标记语言xhtm)、表现(层叠样式表CSS)、行为(文档对象模型DOM、ECMAscript)。

JavaScript是解释性语言,代码可直接运行在浏览器中,由浏览器从上到下顺序解释代码。所以当代码有语法错误时,只能运行到该句错误代码时才会抛出错误。这与java或c++等语言有很大的区别,它们是编译语言,是将代码由编译器编译过后生成机器可直接运行的文件。所以执行速度要比jJavaScript快很多。

DOM提供了一些列可操作文档对象的API,doctment对象可对浏览器中载入的hmtl文档的所有元素进行访问。

doctment.getElementById("id") 该API为通过元素属性名获取元素,参数为元素的id。返回的是对应id的元素对象。

doctment.getElementByTagName("div") 该API通过元素的标签名称获取元素,参数为标签名称,返回结果为数组对象。

doctment.getElementByClassName('className') 该API通过元素的类名获取元素,参数为元素类目,返回结果为数组对象。

getAttribute(attributename) 该API为元素对象内置方法,其作用是获取元素的属性值。 setAttribute(attributename,value) 该API为元素对象内置方法,其作用是设置元素的属性值。

<a id='href' class='href' href="www.baidu.com"><a/>

var a = doctment.getElementByTagName('a'); //根据标签获取a的元素对象
//var a = doctment.getElementById('href');  根据id获取a的元素对象
//var a = doctment.getElementByClassName('href'); 根据类名获取a的元素对象
var href = href.getAttribute('href') //获取a元素上的链接
a.setAttribute('href','www.juejin.com')

今天就先到这,明天继续加油!