什么中DOM:

DOM是一套对文档内容进行抽象各概念化的方法;

例如:我们对别人说:“猫在沙发上!”;别人听到的不会是“狗已经跑了”;这是因为人类对已有的事物有了一套公有的认识;再比如,有人问你,“左手边第三家饭店叫什么 ”;而回答者必需要理解问话者所说的左手边,与第三的含意;同样的在javaScript也同样实用;当我们通过javaScrit控制某个网页元素,或是改变样式时,首先要获得该元素;而获得这些元素的方法正是DOM所约定的;现代DOM多指W3C所约定的一套针对大多是网页而设定的通用api;

javaScript语法:

在html中引用javaScript方法:

方法一:

将代码放在<head></head>标签之间;

<head><stript>javaScript代码放在此处</stript></head>

方法二:

javaScript.js  //源代码单独文件

<stript src = "javaScript.js"> </script>  //将此标签放在html文件<head>或<body>之中;

更好的做法是放在<body> ......<stript src = "javaScript.js"> </script> </body>更有助于网页加载

变量的声明:

var a, b, c, d;

a = "hello";

b = 12;

c = 15.2;

d = 'y';

也可以一次完成,效率更高:var a = "hello", b = 12, c = 15.2, d = 'y';

数组:

创建数组

var a = Array(4);//指定数组大小为4

var b = Array(); //不指定大小的数组

数组的初始化

a[0] = "frist";

a[1] = 2;

a[2] = 3;

a[3] = true;

也可以一步完成 var c = Array("frist", 2, 3, true);//创建初始化

还有一种更简单的方法 var c = ["frist", 2, 3, true];

数组存放的数据,不一定是同一种类形,还可以将变量存放入数组,甚至是数组存放入数组;

对象:

创建对象

var d = Object();

d.name = "alswd";

d.age = 18;

更简单的方式:var d = {name: "alswd", age: 18};

初始化上文b数组:b[0] = d;

访问数组元素,b[0].name = "alswd"; b[0].age = 18;

操作符:

与c++基本相同;

区别:字符串的+运算

var a = "hello " + “world”;

将两个字符串拼接;最终a = "hello world";

值得注意的是,字符串与数值相加得到的是字符串的拼接

var b = “this is ” + 5; 结果 b = "this is 5";

条件判断,逻辑运算,循环语句基本与其它语言相同

值得注意的是条件判断===是可以判断两个值数据类型与值完全相等

==只判断值相等

函数:

如需要多次使用同一段代码 ,则可以把它封装成函数;

函数的定义:

function name(arguments){}

与c++不同的是,他不需要返回值的类型;取而代之的是关键字function;

对象

可以理解成一个简单版c++类,有属性有方法;

在javaScript中对象主要分为:

用户定义对象:由程序员自己定义的对象

内建对象:内建在javaScript语言里的对象;如Array, Math, Date等;

宿主对象:由浏览器提供的对象;  如window对象;window.alrt("hello world");

DOM

(Document , Object, Model) 文档对象模型每当在浏览器创建一个网页,DOM就会把网页转换成一个文档对象模型;文档称为"节点树";

节点:(node)

元素节点(element node):html上的每一个标签,可以理解为一个元素节点,如<body></body>是一个元素结点;

文本节点(text node):再如<p>"hello "</p> <p>元素包含着文本,他是一个文本节点;在<xhtml>中每个文本节点必需放在元素节点内部;而元素节点不一定都有文本节点;

属性节点(attribute node): 由于属性总是放在起始标签里,所以属性节点总是包含在元素节点中;

获取元素节点对象方法:

document.getElementById("html id 属性");通过元素id返回的是该元素的对象

document.getElementsByTagName("li");返回的是一个元素标签对象数组

document.getElementsByClassName("类名"); 通过类名返回相同元素对象数组

获取元素属性方法:

getAttribute("title"); //由于元素属性节点是继存于元素节点的,所以在使用getAttribute()方法首先要获取此元素节点对象;通过对象调用方法返回属性值

如:<p title = "test"> 测试 </p>

document.getElementsByName("p").getAttribute("title");

设置元素属性方法:

setAttribute("attribute", "new vlau");

总结:

主要使用到的方法:

document.getElementById("id");

document.getElementsByName("element");

document.getElementsByClass("class");

(object.)getAttribute("attribute");

(object.)setAttribute("attribute", "valu");

最新文章

  1. 对于一个div下两个横内元素对其或者居中的方法
  2. 转载~kxcfzyk:Linux C语言多线程库Pthread中条件变量的的正确用法逐步详解
  3. Kali Linux Web 渗透测试视频教—第二十课-利用kali linux光盘或者usb启动盘破解windows密码
  4. 移动Web单页应用开发实践——实现Pull to Request(上/下拉请求操作)
  5. 20145317彭垚《Java程序设计》实验二
  6. sail.js学习 - 安装篇
  7. 通过WebBrowser取得AJAX后的网页
  8. 一例胜千言,详谈SQL Sever数据库锁
  9. poj 3628 (搜索or背包)
  10. WDCP LNMPA和LNMP 504 Gateway time-out错误的解决方法
  11. 从零开始PHP学习 - 第四天
  12. centos6.5配置163的yum源
  13. a web-based music player(GO + html5)
  14. 常见ie css hack
  15. [转]Maven如何手动添加jar包到本地Maven仓库
  16. SQL Server 快速大数据排序方法
  17. Contains Duplicate I &amp; III
  18. Python 爬虫利器 Selenium 介绍
  19. python(33)——【re模块】
  20. flex学习笔记 使用函数,显示实时更新的标签

热门文章

  1. Swoft2.x 小白学习笔记 (一) ---控制器
  2. 关于python中的包,模块导入的问题详解(二)
  3. log4j rootLogger配置示例(log4j.properties)
  4. jQuert DOM操作
  5. MySQL-存储引擎-创建表-字段数据类型-严格模式-字段约束-键-02
  6. 2019牛客暑期多校训练营(第二场) - B - Eddy Walker 2 - BM算法
  7. 区间dp 括号匹配问题
  8. C#开发微信公众平台-就这么简单(转载)(附原文链接)
  9. Hacklab WebIDE在线调试ESP32笔记
  10. 简单了解Linux文件目录