【知了堂学习笔记】_JavaScript知识（一）_单击“结算”按钮,使用节点的层次关系访问节点,在页面下方显示各个商品的价格和所-优快云博客

本文链接：https://blog.youkuaiyun.com/TANGLHUI/article/details/78752513

本文介绍了JavaScript的基础概念，包括其作为弱类型、解释型及客户端脚本语言的特点，并详细阐述了JS与HTML、CSS的关系。此外，还深入探讨了JS如何通过DOM模型操作网页元素，实现动态效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

请关注“知了堂学习社区”，地址：http://www.zhiliaotang.com/portal.php

JS概念

什么是jS

脚本语言
语法上弱一点，弱类型语言
解释性语言
位于客户端的脚本语言
基于对象和事件驱动的语言
jS 本身提供了很多内置对象（Sting/Math/Array）
JS还可以创建对象
面向对象和基于对象的差别
JS 能够支持很多事件的响应
Js和html和css的关系
Html+css+js实现静态网页效果的三剑客
Html：内容 css：样式 js：行为（动态效果）
JS运行原理

发送请求到服务器端（jsp和Servlet是在服务器端运行的，js不被运行）
JS被携带在返回的html响应里面
浏览器接受到返回的html响应，浏览器读JS从而实现js效果（js在客户端被运行）
网页中的位置

在<head></head>标签内部
在<body></body>标签内部
链接<link>,注意脚本不能包含<script>标签
变量名规范
必须以字母开头
承兑大小写敏感（y和Y是不同的变量）
以$和_符号开头
脚本语言
是网页动起来
微信小程序基于JavaScript实现的

DOM

不属于JS的技术，将文档转为DOM对象，其他的的技术（JS/DOM）可以操作文档
JS就是能够结合HTML的DOM模型对网页做一系列的效果。
JS对DOM提供了操作的方法和接
DOM的框架
    文档节点
    元素节点（标签）
    文本节点
    属性节点（class id）
    注释节点
节点的属性
    NodeName
        元素节点：标签名 P
        文本节点:#text
        属性节点：属性名 class
    NodeValue
        元素节点：没有
        文本节点：文本值：this is test
属性节点: myinfo

NodeType
    元素节点:1
    文本节点:3
    属性节点:2
JS如何操作节点
    查找节点
        GetElementById
        getElementByTagName
        getElementByClass
        根据节点的层次关系
    删除节点
    修改节点
        Replacechild
        setAttribute
    增加节点（找到父亲的节点，append）
        CreateTextNode
        createElement（创建一个节点）
        appendChild
    改变节点的css样式
        Style.Css属性
    节点层次关系
        childNodes
        ParentNode 
        firstChild
        lastChlid
        nextSibling
        preSibling
    文本的改变
        InnerText（IE）
        InnerHtml
        textContent(火狐）
JS提供哪些事件
    Onclick 点击事件/ondbclick双击事件
    键盘事件 OnkeyUp/down
    鼠标事件 OnmouseOver/
    加载 onload 加载
    提交 onsubmit
    焦点 onfocus
    选择 onselected
    改变 OnChange