html文件 | 易学教程

前端js之BOM和DOM操作

阅读更多关于前端js之BOM和DOM操作

目录引入 BOM操作 window对象 history对象 location对象（重点）弹出框定时器计时器相关 DOM 查找标签直接查找间接查找节点操作创建节点及添加节点删除节点替换节点属性节点及文本节点获取值操作标签类（class）属性标签样式操作事件常用时间绑定事件方式引入 JavaScript分为 ECMAScript，DOM，BOM。 BOM（Browser Object Model）是指浏览器对象模型，它使 JavaScript 有能力与浏览器进行“对话”。 DOM （Document Object Model）是指文档对象模型，通过它，可以访问HTML文档的所有元素。 BOM操作 window对象 Window对象是客户端JavaScript最高层对象之一，由于window对象是其它大部分对象的共同祖先，在调用window对象的方法和属性时，可以省略window对象的引用。例如：window.document.write()可以简写成：document.write()。所有浏览器都支持 window 对象。它表示浏览器窗口。全局变量是 window 对象的属性。全局函数是 window 对象的方法。一些常用的Window方法： window.innerHeight - 浏览器窗口的内部高度 window.innerWidth -

web

阅读更多关于 web

静态页面：不需要网络请求就可以看到的页面叫静态页面，存在本地动态页面：需要网络请求才能看到的页面叫动态页面，存在服务器网页的运行环境浏览器客户端文件的种类 1.文本文件 txt 2.应用程序文件 exe 3.word文件 docx 4.Excel文件 cls 5.ppt文件 ppt 6.网页文件 html 网页搭建 1.靠标签网页的美化 2.靠样式 html 超文本标记语言 hyper text mark language　　 html标签结构双标签有开始和结束的标签叫双标签<p> </p> 单标签：没有结束标签 <meta/>也叫空标签 <html></html>根节点 <head></head>头部标签 <title></title>标题标签 <body></body>身体标签注意父子标签子标签向后缩进来源： https://www.cnblogs.com/lihuhu/p/11880053.html

onblur事件和onfocus事件失效

阅读更多关于 onblur事件和onfocus事件失效

先看onblur事件和onfocus事件的定义： < element onblur=" SomeJavaScriptCode "> < element onfocus=" SomeJavaScriptCode "> 双引号中的内容是一段js代码，也可以是一个事件函数在看几个例子： <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <body> <input name="btn" type="text" placeholder="请输入显示欢迎学习js的次数" onfocus="study(prompt('请输入显示欢迎学习js的次数'))" > <script> function study(count){ for(var i=0;i<count;i++){ document.write("<h4>欢迎学习js</h4>") } } </script> </body> </html> 运行以上代码，鼠标点击输入框（使输入框获得焦点，如下图）输入数字后，如下图，对代码进行修改，如下图：完整代码如下： <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <body>

pug学习

阅读更多关于 pug学习

pug学习 jade(pug) 由于商标版权问题，jade已经改名为Pug。 Pug 是一个高性能的模板引擎，它是用 JavaScript 实现的，并且可以供 Node 使用,当然还支持其他语言。文件后缀名为.pug(.jade) pug优点可读性高灵活的缩进块展开代码默认经过编码处理(转义),安全性高运行时和编译时上下文错误报告支持命令行编译支持html5模式在内存中缓存(可选) 原生支持 Express 合并动态和静态标签类过滤器安装 npm安装建议安装个nrm来进行源管理 npm install pug -g npm install pug-cli -g 测试demo 为了方便编写代码,最好把编译器的tab设置:2. // index.jade doctype html html head title jade test body h2 jade study 粗暴的编译方法 // index.html <!DOCTYPE html><html><head><title>jade test</title></head><body><h2>jade study </h2></body></html> 发现编译后的代码不具备可读性 pug -- help Options: -P, --pretty compile pretty HTML output ##

HTML中关于url、scr、href的区别

阅读更多关于 HTML中关于url、scr、href的区别

HTML中关于url、scr、href的区别 URL是什么 URL ：Uniform Resource Locators（统一资源定位器）的简写，Web浏览器通过URL从Web服务器请求页面。 url不是属性，src和href是属性，src用于替换当前元素，href用于在当前文档和引用资源之间确立联系，也就是说src引用的路径是img等要加载的路径，href引用的路径是要跳转到的地方。 src是什么 src是source的简写，表示的是引入文件，目的是要把文件加载到html页面中去，当浏览器解析的时候会暂停其他的内容而会先加载src内容，必须要等到src的内容加载完成之后才会执行后面。这就是为什么js文件往往放在了html文件的最下面的原因。如果是在页面head上放了js文件用:window.onload事件处理。浏览器会识别该文档为css文档，并行下载该文档，并且不会停止对当前文档的处理。这也是建议使用link的原因。 src的内容是页面必不可少的一部分，是引入src指向的内容会嵌入到文档中当前标签所在的位置。常用的有：img、script、iframe。例如: <script src="script.js"></script> <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">

用php生成HTML文件的类

阅读更多关于用php生成HTML文件的类

目的用PHP生成HTML文档, 支持标签嵌套缩进, 支持标签自定义属性起因这个东西确实也是心血来潮写的, 本来打算是输出HTML片段用的, 但后来就干脆写成了一个可以输出完整HTML的功能; 我很满意里边的实现缩进的机制, 大家有用到的可以看看 p.s. 现在都是真正的前后端分离了(vue, nodejs, webpack...), 这个东西喜欢就用, 不喜欢就算了~ 支持的标签 html, head, meta, title, body, input, select/option, form, table, div, 注释, 以及自定义标签(成对出现的标签), 还有一大堆属性(在下边有介绍) 实现整体每个标签都对应一个类, 比如标签<html>, 对应了一个叫html的类标签中有用到的属性, 我都放到了一个类中了, 并提供了方法去获取赋了值的属性嵌套缩进每个标签我都设计了一个类, 比如 table 标签, 就有一个叫table的类与之对应每个类里边一般都有以下3个重要成员: 本标签的缩进值输出本标签最终字符串的方法, out() 给本标签添加子标签的方发, append() 其中append()接收的是子标签的对象, 在最终调用$html->out()的时候, 每个子标签对象里的out()方法会被依次调用, 缩进值也会从上层类传递到最下层类并累加; 另外,

html--前端css样式初识

阅读更多关于 html--前端css样式初识

一、CSS概述 css是英文Cascading Style Sheets的缩写,称为层叠样式表，用于对页面进行美化，CSS的可以使页面更加的美观。基本上所有的html页面都或多或少的使用css。 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素样式通常存储在样式表中把样式添加到 HTML 4.0 中，是为了解决内容与表现分离的问题外部样式表可以极大提高工作效率外部样式表通常存储在 CSS 文件中多个样式定义可层叠为一二、css样式的引入方法 1、行内式行内式是在标记的style属性中设定CSS样式。这种方式没有体现出CSS的优势，不推荐使用。 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <title>Document</title> 8 </head> 9 <body> 10 <a style="background-color: aqua;color:

JavaScript笔记

阅读更多关于 JavaScript笔记

目录 1.简介 2.JavaScript用法进行web开发一般需了解如下知识： HTML 定义了网页的内容 CSS 描述了网页的布局 JavaScript 网页的行为 1. JavaScript简介 JavaScript是脚本语言，是可插入 HTML 页面的编程代码。 2.JavaScript用法 HTML 中的脚本必须位于 <script> 与 </script> 标签之间。脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中或者把脚本保存到外部文件中来源： https://www.cnblogs.com/wang-mengmeng/p/11851273.html

Html 使用手册

阅读更多关于 Html 使用手册

HTML- (HTML5 标准)官方介绍超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。您可以使用 HTML 来建立自己的 WEB 站点(我们django)，HTML 运行在浏览器上，由浏览器来解析。在本教程中，您将学习如何使用 HTML 来创建站点。学习网站: https://www.runoob.com/html/html-basic.html HTML 　　 1、一套规则，浏览器认识的规则。　　 2、开发者：　　　　学习Html规则　　　　开发后台程序：　　　　　　- 写Html文件（充当模板的作用）　　　　　　- 数据库获取数据，然后替换到html文件的指定位置（Web框架）　　3、本地测试　　　　- 找到文件路径，直接浏览器打开　　　　- pycharm打开测试　　4、编写Html文件　　　　- doctype对应关系　　　　- html标签，标签内部可以写属性 ====> 只能有一个　　　　- 注释：  　　5、标签分类　　　　- 自闭合标签　　　　<meta charset="UTF-8"> 　　　　- 主动闭合标签　　　　<title>Hello</title> 　　6、head标签中　　　　- <meta -> 编码，跳转

AngularJS入门Demo

阅读更多关于 AngularJS入门Demo

1 ：表达式 <html> <head> <title>入门小Demo-1</title> <script src="angular.min.js"></script> </head> <body ng-app> {{100+100}} </body> </html> 执行结果如下：表达式的写法是{{表达式 }} 表达式可以是变量或是运算式 ng-app 指令作用是告诉子元素一下的指令是归angularJs的,angularJs会识别的 ng-app 指令定义了 AngularJS 应用程序的根元素。 ng-app 指令在网页加载完毕时会自动引导（自动初始化）应用程序。 2 ：双向绑定 <html> <head> <title>入门小Demo-2 双向绑定</title> <script src="angular.min.js"></script> </head> <body ng-app> 请输入你的姓名：<input ng-model="myname"> <br> {{myname}},你好 </body> </html> 运行效果如下：注意:输入中文后回车才能显示 ng-model 指令用于绑定变量,这样用户在文本框输入的内容会绑定到变量上，而表达式可以实时地输出变量。 3：初始化指令我们如果希望有些变量具有初始值，可以使用ng-init指令来对变量初始化

订阅 html文件