接触到 JS, 首先要明白和 CSS 之间的区别, 以及作用.
1,JS 如果从外部链接的话, 需要在 head 标签下加入 < script src=""></script>; 如果在内部去定义, 则是在 body 里面加入标签 < script></script>, 在标签里面具体展开设计.
2,JS 相对 CSS, 理论上与 c 语言编码实现某个环节类似, 所以相对比 CSS 难些.
JS 知识点如下:
2.1, 输出: 我觉得弹窗输出的作用方便你检查程序问题, 便于查看结果.
alert() 弹框输出
confirm() 带确定取消按钮的弹框
document.write() 在文档流中输出, 也就是在网页上输出
document.getElementById.innerhtml 修改页面中的 HTML 元素
console.log() 在调试平台中输出
2.2, 输入
3.prompt("提示信息", 默认值); 弹框输入
parseInt(页面表单元素输入值);innerHTML 提取
parseFloat(页面表单元素输入值)
2.3, 数字类型
数字 (number), 字符串 (string), 布尔 (boolean), 数组 (array), 对象 (object), 空 NULL , 未字义类型 (undefined)
对象 ={name:"张三",sex:"男",age:30}. 对象. 调用
2.4 获取对象
document.getElementById("id 名");
document.getElementsByClassName("类名")[索引值];
2.5, 修改值
对象. innerHTML = 新值;
对象. value=
对象. innerText =
2.6, 函数:
定义语法:
function 函数名 (){
// 函数体
}
函数调用:
触发事件 = 函数名 ()
对象. 事件 = function(){}
事件:
onclick 点击事件
onmouseover 鼠标悬停事件
onmouseout 鼠标离开事件
onload 事件 页面加载时调用
onfocus 事件 获取焦点时
onblur 事件 失去焦点时
onchange 事件 HTML 元素发生改变时触发
更改样式:
修改属性值
对象. 属性名 = 属性值
修改 CSS 样式
对象. style. 样式名 = 样式值 样式名 (驼峰式写法 font-size:fontSize)
for 循环 if 语句 while 语句
3,DOM
getAttribute(属性名) 获取元素属性
setAttribute(属性名, 属性值) 设置元素属性
获取子节点方式
childNodes 包含空白节点
children 不包含空白节点
子节点个数
- .childNodes.length
- .children.length
获取对应节点方式
childNodes[索引号]
children[索引号]
父节点:
parentNode
第一个子元素 firstChild
最后一个子元素 lastChild
前一个兄弟元素 previousSibling
后一个兄弟元素 nextSilbling
添加元素 appendChild 添加到内部后面
创建元素 ps=document.creatElement("p");
赋属性值 方式
1)ps. 属性名 = 属性值
2)ps.setAttribute(属性名, 属性值)
在节点前插入元素 insertBefore(新节点, 参考的节点)
父元素. insertBefore(新元素, 参考元素)
删除元素
父元素. removeChild(子元素)
替换元素
父元素. replaceChild(替换的新元素, 被替换的旧元素)
来源: http://www.bubuko.com/infodetail-3317336.html