python全栈 part2 - 002 JavaScript
2018-01-04 本文已影响18人
drfung
JavaScript
背景知识
- javascript是独立的语言,浏览器是javascript解释器.
- 一般存在与html文件中
- head中使用<script type="text/javascript"></script>标签
- 保存在js文件中,引入<script src="path"></script>
- JS代码块放置<body>标签的最下方
- 注释 单行// 多行/* */
- 变量:
name = 'alex' # 全局变量
var name = 'eric' # 局部变量
- 编写代码:
- 在html中编写
- 临时,在浏览器中 -> 审查元素 -> console
基本数据类型
wwww.cnblogs.com/wupeiqi/articles/5602773.html
- 数字
- 字符串
- 列表(数组)
- 字典
- 布尔类型
for循环
- 循环时,循环的元素时索引
a = [11, 22, 33, 44]
for(var item in a){
console.log(a[item]);
}
a = {'k1':'v1', "k2": "v2"}
for(var item in a){
console.log(a[item]);
}
- 三目
for(var i=0;i<10;i=i+1){
}
条件语句
if(){
}else if(){
}else{
}
== 值相等
=== 值和类型都相等
&& and
|| or
实例
- 定时器:
<script>
// 创建一个定时器
setInterval("alert(123);", 5000);
</script>
- 跑马灯:
<div id='i1'>hello world</div>
<script>
function func(){
// 根据ID获取指定标签的内容
var tag = document.getElementById('i1');
// 获取标签内部内容
var content = tag.innerText;
var f = content.charAt(0);
var l = content.substring(1, content.length);
var new_content = l + f;
tag.innerText = new_content;
}
setInterval('func()', 1000)
</script>
Dom
www.cnblogs.com/wupeiqi/articles/5643298.html
1. 找到标签
# 获取单个标签
document.getElementByID("id")
# 获取多个标签(列表)
document.getElementsByName
document.getElementsByClassName
document.getElementsByTagName
# 间接找标签
parentNode // 父节点
childNodes // 所有子节点
firstChild // 第一个子节点
lastChild // 最后一个子节点
nextSibling // 下一个兄弟节点
previousSibling // 上一个兄弟节点
parentElement // 父节点标签元素
children // 所有子标签
firstElementChild // 第一个子标签元素
lastElementChild // 最后一个子标签元素
nextElementtSibling // 下一个兄弟标签元素
previousElementSibling // 上一个兄弟标签元素
2. 操作标签
- innerText
获取标签中的文本内容
标签.innerText
对标签内部文本进行冲刺重新赋值
标签.inenerText = ''
- className
tag.className => 直接整体做操作
tag.classList.add("样式名") 添加指定样式
tag.classList.remove("样式名") 删除指定样式
<div onclick="func();">点我</div>
<script>
function func(){
}
</script>
