js dom学习

JS DOM学习笔记

1.window对象代表当前浏览器窗口 2.使用window对象的属性.方法的时候可以省略window.例如:window.alert("hello")一般写成alert("hello"); window.document一般写成document 3.window.setInterval(method, delay);//每过delay毫秒就调用一次method函数,相当于是计时器 4.window.clearInterval(name); //取消计时器name…

Js dom 学习

节点类型文档节点: 一棵DOM树的顶端是文档节点,它呈现为整个页面(相当于document对象),当需要访问任何元素.属性或文本节点时,都需要通过文档节点来进行导航.(document.) 元素节点 HTML元素描述了HTML页面的结构,需要访问DOM树时,需要从查找元素开始.一旦找到所需的元素,然后就可以根据需要来访问它的文本和属性节点.所以需要先学习访问元素节点的方法,然后再学习如何访问和修改文本及属性值. 属性节点 HTML元素的开始标签中可以包含若干属性,这些属性在DOM树中形成属性节…

创建dom元素 var oLi = document.creteElement('li'); //创建livar aLi = oUl.getElementsByTagName('li');oLi.innerHTML = oTxt.valueoUl.appendChild(oLi) 父节点.insertBefore(子节点,谁之前)oUl.insertBefore(oLi,aLi[0]) 如果一个都没有就会出错 if(aLi.length==0) { oUl.appendChild(oLi)}el…

js再学习笔记

#js再学习笔记 ##基本 1.js严格区分大小写 2.js末尾的分号可加,也可不加 3.六种数据类型(使用typeof来检验数据的类型) `typeof` - undefined: `var name;` ------就是已定义未赋值或者未定义而使用**针对变量来说**,占据一个变量的位置而不使用. - boolean-------布尔类型 - string: `var name="zhangsan"; var englishname='tom';` -----字符串类型,单…

Ext JS 6学习文档–第1章–ExtJS入门指南

Ext JS 入门指南前言本来我是打算自己写一个系列的 ExtJS 6 学习笔记的,因为 ExtJS 6 目前的中文学习资料还很少.google 搜索资料时找到了一本国外牛人写的关于 ExtJS 6 的电子书 [Ext JS 6 By Example].这份资料在 PACKT 上卖 35.99 刀的,当然了万能的 google 还是帮我下载到了 PDF 文档.大概看了一下,讲的很详细,例子也比较简单,容易理解,现我准备利用工作之余翻译这份文档,为自己学习加深理解,也希望能帮助更多的人学习.…

JS Dom节点操作demo!

通过黑马课程的学习,在这里分享一个js Dom中节点操作的小练习需求:使用js创建一个4*3的表格table. onload = function(){ function c(tagName){ return document.createElement(tagName); } var table = c('table'); var tbody = c('tbody'); table.appendChild(tbody); for(var i = 0;i<4;i++){ var tr = c(…

vue.js的学习

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" con…

Ext JS 6学习文档-第8章-主题和响应式设计

Ext JS 6学习文档-第8章-主题和响应式设计主题和响应式设计本章重点在 ExtJS 应用的主题和响应式设计.主要有以下几点内容: SASS 介绍和入门主题响应式设计 SASS 介绍和入门 SASS (Syntactically Awesome Stylesheets) 是一个样式语言,当你使用 SASS 代替 CSS 来写样式,之后 SASS 将使用编译器编译成 CSS ,SASS 有更好的语法和一组特性使我们更容易编写样式.同时维护 SASS 代码比维护 CS 更容易.相比直接写…

Ext JS 6学习文档-第6章-高级组件

Ext JS 6学习文档-第6章-高级组件高级组件本章涵盖了高级组件,比如 tree 和 data view.它将为读者呈现一个示例项目为图片浏览器,它使用 tree 和 data view 组件.以下是本章将要讨论的主题: Trees Data views 拖放图片浏览器 — 一个示例项目本章的主要目标是探索 tree panel 和 data view 并且使用他们来构建一个示例项目图片浏览器.图片浏览器的最终展示效果如下图. 这个项目中的最重要的组件是 tree panel 和…

JS继续学习记录（一）

JS继续学习记录(一) 总感觉自己的js code写的还算可以,但是又深知好像只知道一些皮毛,所以打算仔细记录一下js晋级学习过程,日日往复先记录一下自己目前对js的了解吧(20180828) js作为脚本语言,包括核心语法,dom,bom三部分组成. 1.核心语法:变量,函数的定义,一些js内置对象的调用,如array,如json,基本数据类型,引用数据类型若干,各自的用法云云. 2.dom对象:html的页面对象的封装,封装成的dom对象内包括html的基础属性,衍生属性,监听器,绑定函数…

学习js都学习什么？

前言:js(javaScript)是面向对象(OOP)的编程语言,目前不仅仅是客户端语言了,基予node可以做服务器端程序,那我们学习js都学习什么? 学习js,我们学习它的几部分组成 1.ECMAScript(ES):js核心语法,它是js的语法规划,js中的变量.数据类型.语法规范.操作语句.设计模型等都是ES规定的 2.DOM:document object model 文档对象模型,提供各种API(属性和方法),让js可以获取操作页面中的html元素(DOM元素) 3.BOM:brows…

前端基础-BOM和DOM学习

JavaScript分为 ECMAScript,BOM,DOM. BOM:是指浏览器对象模型,使JavaScript有能力与浏览器进行对象. DOM:是指文档对象模型,通过它,可以访问HTML文档的所有元素. 一.浏览器对象 JavaScript可以获取浏览器提供的很多对象,并并进行操作. window window对象不但充当全局作用域,而且表示浏览器窗口. window对象的属性: 1. innerWidth和innerHeight属性,可以获取浏览器窗口的内部宽度和高度.内部宽高是指除去菜…

js面向对象学习 - 对象概念及创建对象

原文地址:js面向对象学习笔记一.对象概念对象是什么?对象是“无序属性的集合,其属性可以包括基本值,对象或者函数”.也就是一组名值对的无序集合. 对象的特性(不可直接访问),也就是属性包含两种,数据属性和访问器属性. 1.数据属性又包含 Configurable //表示能否通过delete删除,默认为true: Enumerable //表示能否通过for-in循环返回属性,默认为true; Writable //表示能否修改属性的值,默认为true; Value …

js数组学习整理

原文地址:js数组学习整理常用的js数组操作方法及原理 1.声明数组的方式 var colors = new Array();//空的数组 var colors = new Array(3); //长度为3 var colors = new Array('red','blue');//初始化其中,在声明数组的时候,去掉new操作符,也可以. 还有一种初始化数组的方式,使用数组字面量表示法 . 数组字面量由一对包含数组项的方括号表示,多个数组项之间用逗号隔开. var colors = [ '…

货架工程项目之js dom实现项目工程进度图

笔者最近要负责有个项目工程网站的安装进度过程,实现的效果要求大概如下图所示由于笔者没有参与到数据库的制作,得知他们这个项目设计工序的时候就一个开始日期的和完成日期,连整个项目的安装结束时间都没有简直了.这里公开一下我的数据库有点,总之就是说不出话的感觉. 之前笔者写前台table表绑定的时候一般都比较喜欢用tbale表绑个knockout js.这样子比较简单,第一行绑个数据库字段名字勇哥foreach循环输出下,一下子就出来了. 但是这玩意后面的列表明显是要自己在后台弄个转换器自己搞(sq…

js入门学习~ 运动应用小例

要实现的效果如下: 鼠标移入各个小方块,实现对应的效果(变宽,变高,移入透明,移出恢复)~~ (且各运动相互之前不干扰) 主要是练习多个物体的运动框架~~ ----------------------------------------------------js代码如下 ----------------------------------------------------- //执行函数window.onload = function(){ //声明控制变量 var aDiv = docu…

JS入门学习，写一个时钟~

<!doctype html><html><head> <title>数码时钟</title> <meta charset="gb2312"> <style type="text/css"> *{ padding:0; margin:0;} body{background:rgb(0,2…

js DOM优化相关探索

我在这尝试两个方面:-->DOM与js -->DOM与浏览器 (最近在秒味视频上学到不少,哈哈哈) 一.DOM与js 1.js与dom的交互问题频繁的与dom交互,是一件浪费时间与金钱的事情,这就需要我们尽量改进自己的代码,让我们想做的事情尽量在js中做的差不多了在去跟dom打交道. 下面的小例子就说明了问题: <!DOCTYPE html> <html lang="zh"> <head> <meta charset=utf-8&…

【干货分享】Node.js 中文学习资料和教程导航

这篇文章来自 Github 上的一位开发者收集整理的 Node.js 中文学习资料和教程导航.Node 是一个服务器端 JavaScript 解释器,它将改变服务器应该如何工作的概念,它的目标是帮助程序员构建高度可伸缩的应用程序.这些参考资料和教程能够帮助你更好的掌握 Node.js 的应用. 您可能感兴趣的相关文章 10大流行的 Metro UI 风格 Bootstrap 主题推荐35款精致的 CSS3 和 HTML5 网页模板让人爱不释手的精美 Web 应用程序图标素材赞!10套精美的…

js DOM的几个常用方法

<div id="div1">这是个测试</div> <p </p> <p </p> //js DOM的几个常用方法 //document.getElementById, // document.getElementsByTagName, // document.getElementsByClassName, // getAttribute, // setAttribute var div1 = document.getEle…

JS DOM 来控制HTML元素

JS DOM 来控制HTML元素 (ps:这个有很多方法,挑一些详解,嘻嘻) 1.getElementsByName():获取name. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~` 例:<p name="pn">hello</p> <p name="pn">hello</p> <p name="pn">hello</p> <script>…

JS数组学习笔记

原文:JS数组学习笔记最近在备课数组,发现很多ES5的方法平时很少用到.细节比较多,自己做了大量例子和整理,希望对大家了解JavaScript中的Array有所帮助. 概念数组是值的有序集合.每个值叫做元素,每个元素在数组中都有数字位置编号,也就是索引.JS中的数组是弱类型的,数组中可以含有不同类型的元素.数组元素甚至可以是对象或其它数组. JS引擎一般会优化数组,按索引访问数组常常比访问一般对象属性明显迅速. 数组长度范围 from 0 to 4,294,967,295(2^23 - 1)…

js 正则学习小记之匹配字符串

原文:js 正则学习小记之匹配字符串今天看了第5章几个例子,有点收获,记录下来当作回顾也当作分享. 关于匹配字符串问题,有很多种类型,今天讨论 js 代码里的字符串匹配.(因为我想学完之后写个语法高亮练手,所以用js代码当作例子) var str1 = "我是字符串1哦,快把我取走", str2 = "我是字符串2哦,快把我取走"; 比如这样一个字符串,匹配起来很简单 /"[^"]*"/g 即可. PS: 白色截图是 chrome 3…

js 正则学习小记之左最长规则

原文:js 正则学习小记之左最长规则昨天我在判断正则引擎用到的方法是用 /nfa|nfa not/ 去匹配 "nfa not",得到的结果是 'nfa'.其实我们的本意是想得到整个字符串 "nfa not" 的,可却只得到了 'nfa'. 再来看个例子,/an (nfa)?(nfa test)?/ 去匹配 "an nfa test",如果和上面一样的解释,那应该只得到 'an nfa',接着第一个捕获组里是 'nfa' 第二个捕获组里是空. 我…

js 正则学习小记之NFA引擎

原文:js 正则学习小记之NFA引擎之前一直认为自己正则还不错,在看次碳酸钴,Barret Lee 等大神都把正则玩的出神入化后发现我只是个战五渣. 求抱大腿,求大神调教. 之前大致有个印象,正则有很多种引擎,但我根本不知道有哪些引擎. 今天在读<精通正则表达式>才发现有Traditional NFA,POSIX NFA 和 DFA (具体自己百度下吧).可用了这么久的正则,还不知道 js 属于哪一种呢.在<精通正则表达式>里有个简单是方法检测属于哪一种. 用 /nfa|nf…

js 正则学习小记之匹配字符串优化篇

原文:js 正则学习小记之匹配字符串优化篇昨天在<js 正则学习小记之匹配字符串>谈到个字符,除了第一个个,只有个转义( 个字符),所以次,只有次成功.这次匹配失败,需要回溯后用 [^"] 才能匹配成功,当然最后一个 " 会直接匹配成功. 很明显,正常的字符串不可能全是转义,正常的字符串才是主流,当然不排除有人故意全转义的情况.所以这个正则需要次回溯后才能匹配完成,如果字符串增长到 1K 1M 肿么破呢?所以我们要修改下这个正则,前后换下位置么?难道是 /&q…

Js DOM 详解

DOM事件类基本概念 DOM事件的级别 1.DOM0 element.onclick = function(){} 2.DOM2 element.addEventListener("click",function(){},false) 3.DOM3 element.addEventListener("key",function(){},falses) 一.DOM事件模型 1.捕获 2.冒泡二.DOM事件流当浏览器和用户交互的时候事件捕获 - 目标 - 冒泡…

JS原型学习之旅（一）之一图了解原型链关系

目前正在学JS的原型思想(准确的说是从昨天2018.1.29开始正式接触),琢磨了两天,在chrome的console不停的敲了好多代码测试__proto__和prototype的关系,有了些小收获(见下图,俗话说,具体的东西比抽象的更容易吸收,所以我就画了一张图). 图解:不同颜色线互不相交,同种颜色线表示一种指向. 代码: function Person(name){ this.name=name; } //上面代码,创建了一个名为Person的构造器(如果一个函数用于创建对象的话叫构造器)…

js 正则学习小记之匹配字符串字面量优化篇

昨天在<js 正则学习小记之匹配字符串字面量>谈到个字符,除了第一个个,只有个转义( 个字符),所以次,只有次成功.这次匹配失败,需要回溯后用 [^"] 才能匹配成功,当然最后一个 " 会直接匹配成功. 很明显,正常的字符串不可能全是转义,正常的字符串才是主流,当然不排除有人故意全转义的情况.所以这个正则需要次回溯后才能匹配完成,如果字符串增长到 1K 1M 肿么破呢?所以我们要修改下这个正则,前后换下位置么?难道是 /"(?:[^"]|\\…

从 prototype.js 深入学习 javascript 的面向对象特性

从 prototype.js 深入学习 javascript 的面向对象特性 js是一门很强大的语言,灵活,方便. 目前我接触到的语言当中,从语法角度上讲,只有 Ruby 比它更爽. 不过我接触的动态语言只有: js ruby python flash的as 简单的几门, 应该算是井底之蛙之见. js 语法成分简单,没有 ruby 语言复杂.所以有时候我觉得她更干净(Ruby Fans 不要攻击我哦,我也是很爱很爱很爱Ruby的)! prototype.js 无疑是 js的漂亮之作,从它身上应该…

【js dom学习】的更多相关文章