js学习
来源:互联网 发布:mac更改登录用户名 编辑:程序博客网 时间:2024/06/14 06:42
自己学习总结的一些简单的js.
锚点
<a name="html">HTML 教程</a><br><a name="css">CSS 教程</a><br><a name="xml">XML 教程</a><br><a href="/js/">JavaScript 教程</a>document.write(document.anchors.length);//获取锚点数
锚点数量为3个 a标签name指向的是锚点
innerHTML
定义
innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。
用法1:
<body><a name="html">HTML 教程</a><br><a name="css">CSS 教程</a><br><a name="xml">XML 教程</a><br><a id="html">HTML 教程</a><p>文档中第一个锚:<script>document.write(document.anchors[0].innerHTML);</script></p></body>
结果为 HTML 教程
document.getElementById("html").innerHTML
也可获得同样的结果
用法2
<script>function myFunction(){document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";}</script></head><body><h1>我的 Web 页面</h1><p id="demo">一个段落。</p><button type="button" onclick="myFunction()">点击这里</button></body>
结果为:p标签的内容为
我的第一个 JavaScript 函数
调用外部的js
<script src="myScript.js"></script>
调用一个名为myScript的js文件
document.write
请使用 document.write() 仅仅向文档输出写内容。
如果在文档已完成加载后执行 document.write,整个 HTML 页面将被覆盖
例子:
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>document.write()</title> </head><body><h1>会被覆盖</h1><p>我的段落。会被覆盖</p><button onclick="myFunction()">点我</button><script>function myFunction() { document.write(Date());}</script></body></html>
console.log()
作用在控制台输出。
换行
可以使用反斜杠“\”进行换行document.write("你好 \世界!");
可以正常显示,不能下面这样使用!
document.write \ ("你好世界!");
对象创建方法
方法一:
function Obj(){ var obj=new Object(); obj.name="小明"; obj.age=12; obj.ontFun=function(){ }//可以有多个方法 /* obj.twoFun=function(){ }*/ return obj;}var one=Obj();
方法二:
把第一种方法的//var one = Obj();//换成var one = new Obj;
其他方法:
var one = {name : '小明', age : 12 , oneFun : function(){ ... } }//或var one= new Ojbect();one.name = '小明'; one.age = 12; one.oneFun = function(){ }
typeof操作符
typeof可以检测数据类型。
typeof "str" // 返回 string typeof 12 // 返回 numbertypeof false // 返回 booleantypeof [1,2,3,4] // 返回 objecttypeof {name:'小明', age:12} // 返回 object特别提醒:
typeof null //返回objectvar person = null typeof person //返回objectvar person = undefinedtypeof person //返回undefined
var person; // 值为 undefined(空), 类型是undefinedtypeof person //返回undefined
undefined与null的区别
null 和 undefined 的值相等,但类型不等
typeof undefined // undefinedtypeof null // objectnull === undefined // falsenull == undefined // true
constructor 属性
"John".constructor // 返回函数 String() { [native code] }(3.14).constructor // 返回函数 Number() { [native code] }false.constructor // 返回函数 Boolean() { [native code] }[1,2,3,4].constructor // 返回函数 Array() { [native code] }{name:'John', age:34}.constructor // 返回函数 Object() { [native code] }new Date().constructor // 返回函数 Date() { [native code] }function () {}.constructor // 返回函数 Function(){ [native code] }可以使用constructor来查看对象是不是数组或者日期
自动转换类型
当 JavaScript 尝试操作一个 "错误" 的数据类型时,会自动转换为 "正确" 的数据类型。
5 + null // 返回 5 null 转换为 0"5" + null // 返回"5null" null 转换为 "null""5" + 1 // 返回 "51" 1 转换为 "1" "5" - 1 // 返回 4 "5" 转换为 5
href="#"与href="javascript:void(0)"的区别
# 包含了一个位置信息,默认的锚是#top 也就是网页的上端。而javascript:void(0), 仅仅表示一个死链接。
在页面很长的时候会使用 # 来定位页面的具体位置,格式为:# + id。
如果你要定义一个死链接请使用 javascript:void(0) 。
<a href="javascript:void(0);">点我没有反应的!</a><a href="#pos">点我定位到指定位置!</a><br>...<br><p id="pos">尾部定位点</p>
#pos可以定位到id尾pos的尾部定位点
HTML DOM 树
通过 id 查找 HTML 元素
var id=document.getElementById("id");
通过标签名查找 HTML 元素
var id=document.getElementById("id");var p=id.getElementsByTagName("p");
通过类名找到 HTML 元素
var className=document.getElementsByClassName("className");
数字
当一个数字直接出现在JavaScript程序中,我们称之为数字直接量,注意,在任何数字直接量前加负号(-)可以得到他们的负值,但负号是一元求反运算符,并不是数字直接量语法的组成部分。
阅读全文
0 0
- JS学习-JS简介
- js学习
- js学习
- js学习
- js学习
- JS学习
- js学习
- js学习
- js学习
- JS 学习
- js学习
- js学习
- js学习
- js学习
- 学习JS
- js学习
- js 学习
- js学习
- Android Studio mac 虚拟机无法读写遇到的坑
- 4.函数(Swift)
- springMvc 的参数验证 BindingResult result 的使用
- JS常用
- python
- js学习
- 滤波和卷积的区别
- Android Studio中安装Kotlin插件及如何使用
- xcode9 图片记载不显示
- Codeforces 855 B Marvolo Gaunt's Ring
- 那些问题的神回复
- 机器学习入门笔记(八)----支持向量机SVM
- ping 丢包或不通时链路测试说明
- 快速排序