沈阳网站建设Javascript DOM和BOM

新闻来源:www.dtnnet.com 发布时间:2019-09-09

沈阳网站建设Javascript文档对象模型DOM和浏览器对象模型BOM的用法,在DOM部分主要包括对HTML元素的查找、动态创建、内容属性修改,以及事件和节点:在BOM部分主要包括了5种常用对象。

沈阳网站制作学习目标掌 Javascript DOM的用法;掌握 Javascript BOM的用法。

1文档对象模型

1.1查找HTML元素

在 Javascript i中有3种方式可以查找HTML元素。

通过HTML元素的d名称查找

通过HTML元素的标签名称查找

通过HIML元素的类名称查找。

1.通过d名称查找HTML元素

一般默认不同的HTML元素使用不一样的d名称以示区别,因此通过id名称找到指定的单个元素,在 Javascript中语法如下。

docu-ent. getelementbyid("id名称”);

其中, getelementbyld方法逆照驼峰命名法,即第一个单词全小写,后面的每一个单词的首字母大写。这种命名方法在 Javascript中比较普遍。如果未找到该元素,返回值为null如果找到该元素,则会以对象的形式返回。

例如,查找id="tcs"的元素井获取该元素内部的文本内容。

/根据1d名称获取元素对象

var test-document getelementbyid("test")i//获取元素内容

var result-testinnerhtml

为使代码简便,使用了与id名称同名的变量test来获取指定元素,该变量名称也可以是其他自定义变量名,不影响运行效2

HTML元素均有定的标名称,因此通过标名称可以到指定的单个一系列元素,在 Javascript I中语法如下

document.e tll ementsbytagnam("名称”此时方法中的 ements是复数形式,因为要考虑到有可能存在多个元素符台要求。同样,如果未找到符合的元素,返回值为mu如果有多个符台条件的元素,则值是数

组的形式例如,查找所有的段落元素p>并获取第一个段落标内部的文本内容

at p-document, etelementbytagham ("p"/

result-p[o).innerhtmli

因为有多个段落标,所以变量的返回值是数组的形式・其中,第一个段落标多对应是이,以此类推,最后一个元素对应的索引号为数组长度

3.通过类名称查找HTML元紫

document gete lementsbyclassnamet()方法可用于根据类名称获取HTM.元素,在Javascript中语法如下naty名此时方法中的 Elements是复数形式,因为要考虑到有能存在多个元素符台要求,同样,如果未找到符合的元素,返回值为mul如果有多个符合条件的元素,则返回值是数组的形式

6、7、8版本中使用均无,为滤各个版本词的,如

果不能保证用户使用IE5、6、7、8阪本以外的湖览器,则不建以使用此方法来获取fTML.

注:该方法在IE5

元素

分别根据d名称、标签名称和类名称查找指(的元素对象,并使川aem0语句输出指JavascriptDoM查找元素的对象,并使用alert()语句输出指定元素对象的内容。


Back to Top