2018-05-16

今天继续学习JavaScript。

1.表单验证:在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证

    验证的点:表单的必填项是否填写;输入的项是否合法(格式、类型);

2.查找html元素的方式:

    通过 id 找到 HTML 元素

    通过标签名找到 HTML 元素

    通过类名找到 HTML 元素

3.改变html元素: document.getElementById(id).innerHTML=new HTML

   改变html元素的属性:document.getElementById(id).attribute=new value;

                                 eg:document.getElementById("image").src="landscape.jpg";

    改变html元素的样式:document.getElementById(id).style.property=new style

4.对事件作出反应:

    HTML 常见事件:当用户点击鼠标时;当网页已加载时;当图像已加载时;当鼠标移动到元素上时;当输入字段被改变时;当提交 HTML 表单时;当用户触发按键时……

    onload 和 onunload 事件会在用户进入或离开页面时被触发。

    onchange 事件常结合对输入字段的验证来使用。

    onmouseover 和 onmouseout 事件可用于在用户的鼠标移至 HTML 元素上方或移出元素时触发函数。

    onmousedown, onmouseup 以及 onclick 构成了鼠标点击事件的所有部分。首先当点击鼠标按钮时,会触发 onmousedown 事件,当释放鼠标按钮时,会触发 onmouseup 事件,最后,当完成鼠标点击时,会触发 onclick 事件。

5.添加和删除节点(HTML 元素)

    向 HTML DOM 添加新元素,首先创建该元素(元素节点),然后向一个已存在的元素追加该元素:

var para=document.createElement("p");//创建新元素

var node=document.createTextNode("这是新段落。");//要添加的文本节点

para.appendChild(node);向新元素追加这个文本节点

var element=document.getElementById("div1");//找到已有的元素

element.appendChild(para);//向这个已有的元素追加新元素

删除 HTML 元素,首先使用其 parentNode 属性来找到父元素:

var child=document.getElementById("p1");

child.parentNode.removeChild(child);

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  •   JavaScript 与 HTML 之间的交互是通过事件实现的。   事件,就是文档或浏览器窗口中发生的一些特...
    霜天晓阅读 3,555评论 1 11
  • HTML DOM 定义了访问和操作 HTML 文档的标准。 什么是 HTML DOM? HTML DOM 是: H...
    亮亮叔家的小笔笔阅读 4,969评论 1 5
  • 警告请使用 document.write() 仅仅向文档输出写内容。如果在文档已完成加载后执行 document....
    鹿守心畔光阅读 636评论 0 10
  • 欢迎关注个人微信公众账号:byodian个人博客:Byodian's Blog JavaScript 基础知识总结...
    工具速递阅读 778评论 0 3
  • 第1章 认识JS JavaScript能做什么?1.增强页面动态效果(如:下拉菜单、图片轮播、信息滚动等)2.实现...
    mo默22阅读 1,349评论 0 5