JS和Document
对象
1.new var obj = new Object();
2.函数声明对象
function Human () {};
3.var obj = {}; 大括号 就是对象
var obj = {};
obj.name = '张三' ;
obj.age = 20;
obj.say = function () {};
4.var obj = {}; 大括号内放入属性 用:
var obj = {
name:'张三',
age:20,
sex:0,
run:function () {}
}
JSON
存储和和交换信息的语法
JSON 是轻量级的文本数据交换格式
JSON 独立于语言和平台 :
JSON使用JavaScript语法来描述数据对象
JSON解析器和JSON库支持许多不同的编程语言 :
目前非常多的动态编程语言,如PHP/JSP/.NET等都支持JSON.
格式
数据类型 :
JSON数字 : {"age":20}
JSON布尔 : {"flag":true}
JSON null: {"name":null}
JSON对象 : {"name":"lisi","age":20}
JSON数组 :
{
"courses":[
{"name":"JavaSE","time":20},
{"name":"HTML","time":1},
{"name":"CSS","time":2},
{"name":"JavaScript","time":3}
]
}
转换
JS对象和json类型的对象都可以通过 JSON.stringify() 转换为字符串,
JSON.parse() 方法将 数据/文本 转换为 JavaScript 对象。
Document
当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model)
dom元素和node(节点)的区别
dom元素指的是页面的标签,通过任意一个dom元素的关系可以找到当前页面其他任意的一个dom元素;
node节点指的是页面的任意元素(页面的每个东西都是节点),
其中
标签 换行符 注释 空格 属性 标签内容等都可以被当做node节点
当文档/页面加载完毕后才会执行onload函数
通过class选中 而选取ID 和 标签名 都很少用
1.id选择
document.getElementById();
2.通过标签名选中
document.getElementsByTagName();
3.通过class选中
document.getElementsByClassName();
4.通过标签的name属性来获取的对象集合
document.getElementsByName() ;
最常用!! ie6,7,8不支持! 而且ie8不支持console.log()
注意 : getElementsByClassName()函数的返回值是一个数组
添加事件的两种方式
方式1 :通过下标获取第一个元素
方式2 : 在标签中定义事件,事件触发函数
事件的三要素
1.谁(事件对象)
2.什么事件(操作:点击?聚焦?离焦?等)
3.怎么处理(效果怎么展示)
input 获取内容使用value,option也是使用value属性来获取值
value 这个属性只有input和option两个标签有这个属性.
innerHTML属性是来给标签设定展示给用户的内容
innerHTML和innerText
把字符串内容转换number 来进行计算
num1 = parseInt(num1);
num2 = parseInt(num2);
JS和Document的更多相关文章
- JS function document.onclick(){}报错Syntax error on token "function", delete this token
JS function document.onclick(){}报错Syntax error on token "function", delete this token func ...
- js 节点 document html css 表单节点操作
js 节点 document html css 表单节点操作 节点操作:访问.属性.创建 (1)节点的访问:firstChild.lastChild.childNodes.parentChild(父子 ...
- JS 中document.URL 和 window.location.href 的区别
实际上,document 和 window 这两个对象的区别已经包含了这个问题的答案. document 表示的是一个文档对象,window 表示一个窗口对象. 一个窗口下面可以有很多的documen ...
- 原生js方法document.getElementsByClassName在ie8及其以下的兼容性问题
document.getElementsByClassName在ie8及其以下浏览器的兼容性问题,在ie8及其以下浏览器中不能使用,针对这个问题,下面给出详细的解决方法,感兴趣的朋友可以参考下 ...
- JS中的DOM对象及JS对document对像的操作
DOM对象 windows:属性:opener(打开者) 方法:open().close(),setTimeout().setInterval()... location:属性:href 方法:rel ...
- JS的document.links函数使用示例
? <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title&g ...
- JS的document.images函数使用示例
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- JS的document.anchors函数使用示例
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- JS的document.all函数使用示例
JS的document.all函数虽然被document.getElement......代替,但是在使用中还是较为常见,下面为大家详细介绍下具体的使用示例: 一: document.all是页面内所 ...
- JS function document.onclick(){}报错Syntax error on token "function", delete this token - CSDN博客
原文:JS function document.onclick(){}报错Syntax error on token "function", delete this token - ...
随机推荐
- Spring事务的底层原理
1. 划分处理单元--IOC 由于spring解决的问题是对单个数据库进行局部事务处理的,具体的实现首相用spring 中的IOC划分了事务处理单元.并且将对事务的各种配置放到了ioc容器中(设置事务 ...
- Java (强/弱/软/虚)引用
一.整体架构
- Centos7端口开放及查看
1.开放端口 firewall-cmd --zone=public --add-port=端口/tcp --permanent eg:firewall-cmd --zone=public --add- ...
- 基于swiper.js的异型轮播
基于原生swiper.js的异型轮播 <div class="swiper-container" > <div class="swiper-wrappe ...
- JQuery日期选择控件-兼容手机端
在项目中经常使用到日期时间控件. 用的时候总是临时去找,现在记录下,以备下次使用. 官网http://www.bootcss.com/p/bootstrap-datetimepicker/ 需要引用一 ...
- 【LeetCode动态规划#07】01背包问题一维写法(状态压缩)实战,其二(目标和、零一和)
目标和(放满背包的方法有几种) 力扣题目链接(opens new window) 难度:中等 给定一个非负整数数组,a1, a2, ..., an, 和一个目标数,S.现在你有两个符号 + 和 -.对 ...
- AI测试101:测试AI系统的实用技巧&ML和AI自动化工具
基于人工智能的系统,也称为神经网络(NN Neural Networks),和其他应用程序一样是 "系统",因此需要测试.本文将指导你测试AI和基于NN的系统,并理解相关概念. 测 ...
- 原来这就是所谓的 JSR!
相信大家在学习 Java 的过程中,或多或少都见过 JSR 这个词.本篇文章就科普下什么是 JSR. 什么是 JSR ? JSR(Java Specification Requests),是指 Jav ...
- Java的final修饰符
final 实例域 可以将实例域定义为 final.对于 final 域来说,构建对象时必须初始化 final 实例域,构造对象之后就不允许改变 final 实例域的值了.也就是说,必须确保在每一个构 ...
- python pyinstaller库
简要 pyinstaller模块主要用于python代码打包成exe程序直接使用,这样在其它电脑上即使没有python环境也是可以运行的. 用法 一.安装 pyinstaller属于第三方库,因此在使 ...