DOM对象对于js来说,是个很基础的元素,我们写js一般来说,都一定会对它进行操作.我们可以很方便地给它加上自定义的属性,比如: var test = document.getElementById("test"); test.adang = "adang"; alert(test.adang); 我们会发现,已经给这个id为test的DOM元素添加了一个叫做adang的属性了,然后在js中,可以调用这个属性.我在写js的时候经常用到这种方法,可以很方便地对某个do…
1.js的Array对象           ** 创建数组(三种)                          - var arr1 = [1,2,3];                          - var arr2 = new Array(3); //长度是3                          - var arr3 = new Array(1,2,3); //数组中的元素是1 2 3 - var arr = []; //创建一个空数组            *…
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>js的DOM对象</title> <script type="text/javascript"> // DOM:Document Object Model 文档对象模型 /* 文档:超文本文档html.xml 对象:提供了属性和方法 模型:使用属性和方法操作超文本标…
js的dom对象(带实例超详细全解) 一.总结 一句话总结: 1.DOM中的方法区分大小写么? 解答:区分 2.DOM中元素和节点的关系式什么? 解答:元素就是标签,节点中有元素节点,也是标签,节点中还有其它节点 3.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 这句话对么? 解答:对 4.举一个属性节点的例子? 解答:如<a>标签的链接属性href="http://www.imooc.com".属性节点:元素属性, 5.属性节点就是元素的属性么?…
继续JS之DOM对象二 前面在JS之DOM中我们知道了属性操作,下面我们来了解一下节点操作.很重要!! 一.节点操作 创建节点:var ele_a = document.createElement('a');添加节点:ele_parent.appendChild(ele_img);删除节点:ele_parent.removeChild(ele_p);替换节点:ele_parent.replaceChild(新标签,旧标签); 1 <!DOCTYPE html> 2 <html lang=…
js之DOM对象一 一.什么是HTML  DOM HTML  Document Object Model(文档对象模型) HTML DOM 定义了访问和操作HTML文档的标准方法 HTML DOM 把 HTML 文档呈现为带有元素.属性和文本的树结构(节点树) 二.DOM树 画dom树是为了展示文档中各个对象之间的关系,用于对象的导航. 三.DOM节点 1.节点类型 HTML 文档中的每个成分都是一个节点. DOM 是这样规定的:    整个文档是一个文档节点     每个 HTML 标签是一个…
jQuery就是JS的一个扩展库,工具库,提供很多方便快捷的方法,所以将JS对象转换为jQuery对象后,能更方便地操作这个对象.但是jQuery对象也不是万能的,有一些JS对象有的能,jQuery对象并没有提供,所以需要转换回JS对象,才能进行操作.另外一种情况可能是,你使用某些第三方库,接口函数只能接受JS对象或者jQuery对象,那么你就需要在这两者之间进行转换. 1.将jQuery转换为dom对象的方法 [index] 或者.get(index): a.$(“#form”)[index]…
js操作DOM对象  (Document Object Model)文档对象模型 nodeType返回值 1:元素节点 2:属性节点 3:文本节点 8:注释节点 9: 文档节点 nodeName 节点名称 nodeType 节点类型 nodeValue 节点值 setAttribute("属性名","属性值")getAttribute("属性名") 根据属性名获取对应的属性值 getAttributeNode("属性名") 获…
js之DOM对象三   一.JS中for循环遍历测试 for循环遍历有两种 第一种:是有条件的那种,例如    for(var i = 0;i<ele.length;i++){} 第二种:for (var i in li ){} 现在我们来说一下测试一下第二种(数组和obj的) 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"&g…
前端基础之BOM和DOM 前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互,我们需要继续学习BOM和DOM相关知识. JavaScript分为 ECMAScript,DOM,BOM. BOM(Browser Object Model)是指浏览器对象模型,它使 JavaScript 有能力与浏览器进行“对话”. DOM (Document Object Model)是指文档对象…
前面在JS之DOM中我们知道了属性操作,下面我们来了解一下节点操作.很重要!! 一.节点操作 创建节点:var ele_a = document.createElement('a');添加节点:ele_parent.appendChild(ele_img);删除节点:ele_parent.removeChild(ele_p);替换节点:ele_parent.replaceChild(新标签,旧标签); <!DOCTYPE html> <html lang="en"&g…
前面在JS之DOM中我们知道了属性操作,下面我们来了解一下节点操作.很重要!! 一.节点操作 创建节点:var ele_a = document.createElement('a');添加节点:ele_parent.appendChild(ele_img);删除节点:ele_parent.removeChild(ele_p);替换节点:ele_parent.replaceChild(新标签,旧标签); <!DOCTYPE html> <html lang="en"&g…
我们在日常的应用中,使用Javascript大多数时间都是在用DOM ,以致于很多人都有一种看法就是DOM==JS,虽然这种看法是错误的,但是也可以说明DOM的重要性. 这就导致了我们在写JS的时候,首先会考虑的是这个方法在页面上会产生什么样的变化之类的问题,用架构的思想来说:我们可以说这样把用户界面和业务逻辑掺杂到了一起.我们也知道,这样对于一个稍大的项目来说,满脑袋都是DIV,都是CSS是做不好东西的. 那么怎么办?我们还是用对象的角度,从逻辑上来考虑这个问题,让我们忘记那些DOM对象. 我…
js获取到的dom对象的style通常是没有值得,因为我们都写在外部文件中,从慕课网上见到讲师封装的一个方法,挺不错.特此记录下来. function getStyle(obj,attr){ if(obj.currentStyle){//兼容IE return obj.currentStyle[attr]; }else{ return getComputedStyle(obj,false)[attr]; } }…
<div> <button id="bt" onclick="ChangeColor()">Clike To Change Color</button> </div> <script> function ChangeColor() { debugger; var Bt = document.getElementById("bt"); //Bt是DOM对象 Bt.style = "…
介绍DOM1中底层的一些属性和方法. 节点操作 appendChild() parentNode.appendChild(newNode)  在parentNode节点的最后插入newNode insertBefore() parentNode.insertBefore(newNode,someNode)  在parentNode节点里面的someNode节点前插入新节点newNode replaceChild() parentNode.replaceChild(newNode,someNode…
一.JavaScript的三个重要组成部分 (1)ECMAScript(欧洲计算机制造商协会) 制定JS的规范 (2)DOM(文档对象模型)重点学习对象 处理网页内容的方法和接口 (3)BOM(浏览器对象模型)  存在兼容性问题 与浏览器进行交互的方法和接口 1.DOM定义 为js操作html元素而制定的规范,DOM树如下图 2.节点 整个文档是一个文档节点 每一个标签是一个元素节点 标签中的文字是一个文字节点 标签中的属性是一个属性节点 3.访问节点的方法 getElementById();…
一.什么是HTML  DOM HTML  Document Object Model(文档对象模型) HTML DOM 定义了访问和操作HTML文档的标准方法 HTML DOM 把 HTML 文档呈现为带有元素.属性和文本的树结构(节点树) 二.DOM树 画dom树是为了展示文档中各个对象之间的关系,用于对象的导航. 三.DOM节点 1.节点类型 HTML 文档中的每个成分都是一个节点. DOM 是这样规定的:    整个文档是一个文档节点     每个 HTML 标签是一个元素节点     包…
http://www.cnblogs.com/zourong/p/4792394.html 这篇文件介绍了DOM1中的一些属性和方法,下面的内容主要介绍DOM2和DOM3中新增的内容. 框架的变化 框架和内嵌框架分别用HTMLFrameElment和HTMLIFrameElement,DOM2中新定义了一个框架的属性contentDocument,是一个指向框架内容的文档对象的指针.contentDocument属性是Document类型的实例.IE8之前的版本不支持contentDocumen…
  一.JS中for循环遍历测试 for循环遍历有两种 第一种:是有条件的那种,例如    for(var i = 0;i<ele.length;i++){} 第二种:for (var i in li ){} 现在我们来说一下测试一下第二种(数组和obj的) <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Ti…
object.style.display = value; objcet对象必须是确定单个对象. 若以class名和标签名查找,需要指定对象集合中的第几个.…
首先应该明白什么是流?这个估计也很容易明白,我就不说了.顺便说下,float设置了这个属性就暂时脱离了流的存在,clear后才会到流里面. position:absolute| fixed | relative| static | inherit 默认的HTML流属性其实就是指position:static.如果我们想要在页面上固定显示元素,就选择absolute,它是以页面左上角为(0,0),根据top,left,width,height来布局的,注意这里是根据页面布局.fixed是当前窗口布…
好久不来写东西了,这段时间太慢了,闲了下来看了几篇文章,觉得很好,同时也许咱们大家都能遇到,所以就把它记录下来... 简单使用JavaScript.JQuery.ExtJs进行DOM对象创建的测试,主要是使用JavaScript.JQuery.ExtJs动态创建Table对象.动态Table数据填充.多选控制. 1.简单前台数据处理界面有点丑了,没美化界面,主要是JavaScript动态创建Table.效果图: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTM…
在今天的工作中发现了一些小的问题,在网上查了一下,才知道自己的js才是冰山一角,以后要虚心向他人学习,要虚怀若谷. 发现一:js获取DOM对象与jquery的区别 先前总以为,二者是一样的,最近才知道,二者是不同的: 前者使用var jsTab = document.getElementById("tab");//其中tab为所选择dom对象id的属性值. 后者var jqTab = $("#tab");//不仅需要id属性值,还需要加上#,这是jquery所规定的…
jQuery(DOM对象) 或者 $(DOM对象) 此函数的作用是将DOM对象,转换为jQuery的对象 DOM对象其实就是javascript的函数对象,可以用来操作所有HTML元素.比如: a标签是html元素,document是DOM对象 [需求] 分别定义DOM对象和jQuery对象,通过instanceof 关键字分别判断它们是否是jQuery对象 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"…
this指的是原生js的DOM对象 .css(“”):只写一个值是取值,写俩值是赋值 window.onload   ===   $(document).ready(); $(“”):获取元素   标签名..类名.#id jQuery特点 链式编程 jq.shou(3000).html(内容) 相当于 jq.shou(3000) jq.gtml(内容) 隐式迭代 隐式实用for循环.迭代 如何使用jQuery 引包 一定要在使用之前 <script src = ‘’><> 入口函数…
DOM对象的三种在添加自定义属性的方式 一是 通过 “.”+“属性名” 二是 setAttribute()(getAttribute()获取) 三是 直接在元素标签上加属性  如:<div  name="" id="te"  class=""   content=""></div> 三者的区别主要是在获取属性值方面: 1.var e = document.getElementById("te&…
1.open,setTimeout,setInterval,clearInterval,clearTimeout <!DOCTYPE> <html> <head> <meta charset="UTF-8"></meta> <title></title> <script type="text/javascript"> // BOM:浏览器对象,broswer object…
11.html元素事件属性中,如onclick="",双引号里可以是方法条用,可以是js代码(无需加<script>标签) 12.JavaScript内置 对象.属性和方法(您也应该避免使用 JavaScript 内置的对象.属性和方法的名称作为 Javascript 的变量或函数名):Array     Date     eval     function     hasOwnPropertyInfinity     isFinite     isNaN     isPr…