你可以根据需要调整这些属性值。 和直接修改原始html文件有什么区别？ 使用 iframe 嵌入一个外部 HTML 文档与直接修改原始 HTML 文件有一些区别。...即使内容为空，加载也需要时间 没有语意 4. href 与 src的区别 href (Hypertext Reference)指定网络资源的位置，从而在当前元素或者当前文档和由当前属性定义的需要的锚点或资源之间定义一个链接或者关系...（目的不是为了引用资源，而是为了建立联系，让当前标签能够链接到目标地址。） src source（缩写），指向外部资源的位置，指向的内容将会应用到文档中当前标签所在位置。...href与src的区别 1、请求资源类型不同：href 指向网络资源所在位置，建立和当前元素（锚点）或当前文档（链接）之间的联系。...在请求 src 资源时会将其指向的资源下载并应用到文档中，比如 JavaScript 脚本，img 图片； 2、作用结果不同：href 用于在当前文档和引用资源之间确立联系；src 用于替换当前内容
HTML基础知识 HTML的历史：HTML，XHTML HTML的全局属性：全局标准属性，全局事件属性 HTML的元素： ? image ?...HTML的全局事件属性 Window窗口事件 onload，在页面加载结束后触发。 onunload，在用户从页面离开时触发，如单击跳转，页面重载，关闭浏览器窗口等。...该属性不会对所有按键生效，不生效按键如：alt，ctrl，shift，esc。 onkeyup，当用户释放按键时触发。 Mouse鼠标事件 onclick，当在元素上单击鼠标时触发。...锚点链接是用#+对应的锚点，锚点通常用唯一属性值id设定。 图像热区链接 图像热区链接，是什么呢？...属性 说明 border 设置表格的边框宽度 width 设置表格的宽 height 设置表格的高 cellpadding 设置内边距 cellspacing 设置外边距 的两个属性：colspan
HTML基础知识 HTML的历史：HTML，XHTML HTML的全局属性：全局标准属性，全局事件属性 HTML的元素： 标记语言...HTML的全局事件属性 Window窗口事件 onload，在页面加载结束后触发。 onunload，在用户从页面离开时触发，如单击跳转，页面重载，关闭浏览器窗口等。...锚点链接是用 #+对应的锚点，锚点通常用唯一属性值 id设定。 图像热区链接 图像热区链接，是什么呢？...属性 说明 border 设置表格的边框宽度 width 设置表格的宽 height 设置表格的高 cellpadding 设置内边距 cellspacing 设置外边距 的两个属性：...空元素 frame属性 属性 说明 src 需要显示的html文档 frameborder 定义框架的外边框，属性值为0或者1 scrolling 定义是否显示滚动条,有3
https://github.com/pandao/editor.md 百度那个不用说了，很古老的一个，很早没更新了，github这两个markdown编辑器，也有很多地方不满意，于是看了下原理。...我们这里是利用designMode，然后再页面中嵌入一个iframe，将其designMode设置为on，这样就可以实现编辑。...AbsolutePosition 设定元素的 position 属性为“absolute”(绝对)。 3. BackColor 设置或获取当前选中区的背景颜色。 4....CreateBookmark 创建一个书签锚或获取当前选中区或插入点的书签锚的名称。 10....FontName 设置或获取当前选中区的字体。 17. FontSize 设置或获取当前选中区的字体大小。 18. ForeColor 设置或获取当前选中区的前景(文本)颜色。
URL的锚部分（#及其以后的部分）； window.location.host()——返回/设置主机名及端口 window.location.href()——返回完整的URL； window.location.search...开始的URL）； window.location.port()——返回/设置一个URL服务器使用的端口号； 方法： window.location.reload()——重新加载当前文档； window.location.assign...； 2、css方法“：fixed；会出现广告窗口抖动的情况； 二、浮动框架 其中，src="URL...运用： xx <iframe src="YY.html" framborder="0"...目前用在邮箱(如qq邮箱)中、w3school的代码测试页面、网易音乐的底部播放条、所见即所得的网页编辑器（WYSIWYG Online HTML Editor）均在使用。
Doctype是HTML5的文档声明，通过它可以告诉浏览器，使用哪一个HTML版本标准解析文档。在浏览器发展的过程中，HTML出现过很多版本，不同的版本之间格式书写上略有差异。...，语义化更具可读性，遵循W3C标准的团队都遵循这个标准，可以减少差异化 3. src 和 href 的区别 src和href都是HTML中特定元素的属性，都可以用来引入外部的资源。...但是可以通过JS动态给ifame添加src属性值来解决这个问题，当然也可以解决iframe会阻塞主页面的Onload事件的问题 会产生很多页面，不易管理 浏览器的后退按钮没有作用 无法被一些搜索引擎识别...采用微格式的web页面，在HTML文档中给一些标签增加一些属性，这些属性对信息的语义结构进行注解，有助于处理HTML文档的软件，更好的理解HTML文档。...当然，a元素最常见的就是用来做锚点和 下载文件。
文档类型 「文档类型」用来说明你用的XHTML或者HTML是什么版本。<!DOCTYPE html告诉浏览器按照HTML5标准解析页面。...在移动端和pc端视口是不同的，pc端的视口是浏览器窗口区域，而在移动端有三个不同的视口概念：布局视口、视觉视口、理想视口 meta有两个属性name 和 http-equiv name属性的取值 keywords...href是Hypertext Reference的缩写，指向网络资源所在位置，建立和当前元素（锚点）或当前文档（链接）之间的链接。...锚点定位：通过创建锚点链接，用户能够快速定位到目标内容。 1. 使用相应的id名标注跳转目标的位置。 (找目标) 第2集 2....1、href 是指向网络资源所在位置，建立和当前元素（锚点）或当前文档（链接）之间的链接，用于超链接。
由于浏览器存在同源策略机制，同源策略阻止从一个源加载的文档或脚本获取或设置另一个源加载的文档的属性。...浏览器同源策略并不是对所有的请求均制约： 制约： XmlHttpRequest 不叼： img、iframe、script等具有src属性的标签 跨域，跨域名访问，如：http://www.c1.com...数据交互 iframe标签加上form表单,原理很简但就是让form提交的数据不给后台而是给iframe,然后让iframe拿上数据提交给后台,重点来了,target参数是个关键点,是他让form把数据传给了...前端fake_ajax.html代码（原理，易错点，关键点都在这里面） <!...,增加个什么东西了都会重新加载这个标签,但是还有个问 //题第一次加载iframe标签的时候就触发onload事件了,但是事件对应的函数代码 //却还没有加载上这个时候就会报错，解决方案如上
img 是 image 单词的所以，是图像、图像的意思; 事实上 img 是一个可替换元素( replaced element ); img 有两个常见的属性: src 属性 :source 单词的缩写...✓ _self:默认值，在当前窗口打开URL; ✓ _blank:在一个新的窗口中打开URL; ✓ 其他不常用, 后面iframe可以讲一下; a元素 - 锚点链接 锚点链接可以实现:跳转到网页中的具体位置...锚点链接有两个重要步骤: 在要跳到的元素上定义一个id属性; 定义a元素，并且a元素的href指向对应的id; a元素 - 图片链接 在很多网站我们会发现图片也是可以点击进行跳转的 img...某些网页禁止嵌套(原理) 和a元素结合(target另外两个值) 利用 iframe 元素可以实现:在一个 HTML 文档中嵌入其他HTML文档 frameborder属性 用于规定是否显示边框...全局属性 我们发现某些属性只能设置在特定的元素中: 比如 img 元素的 src、a元素的 href; 也有一些属性是所有HTML都可以设置和拥有的，这样的属性我们称之为 “全局属性(Global
命名锚的语法： 锚 例子： 首先，在HTML文档中对锚进行命名(创建一个书签)： 基本的注意事项-有用的提示 然后，在同一个文档中创建指向该锚的链接... 带有图像的一个段落。图像的 align 属性设置为 "left"。...iframe语法: 该URL指向不同的网页。 Iframe-设置高度与宽度 height和width属性用来定义iframe标签的高度与宽度。... 使用iframe来显示目标链接页面 iframe可以显示一个目标链接的页面 目标链接的属性必须使用..."); JavaScript事件响应: 点我！
dispaly:inline.行级元素，不可设置宽和高，默认宽高是内容的宽和高，典型的比如，span, 4、html鼠标小手： cursor:pointer; 5、html背景图属性： background-size...indx.php是框架显示的页面，最上面，也就是没按键显示 <iframe src="index.php" style="width:100%;height:100%;border:none " name...; 13、锚点的设置 在你想跳转的页面的地方加上： 然后在你想加链接的地方加上去找锚点 14.点击换验证码图片 <img src=".../public/common/yzm.php" alt="" style="cursor:pointer" onclick="this.src='../public/common/yzm.php?...17、html块状元素和内联元素的总结，块状元素可以设置margin，但是使用margin的时候要符合：1.块状元素，2.有宽高，其中内联元素不能设置margin和宽高的属性，只能设置padding ?
如果我们用服务器打开，我们的不同tab页面通信完成了，而且是实时的。 2. 玩转iframe 我们都知道frame可以跨域，那么我们来试一下。...，只能服务器打开 2.3 window.name （能跨域） 类似于vue、react的prop父子传值，只要在父窗口设置iframe标签的name，在子窗口就可以读到。...你可以另外建立两个不同的html，也可以建立两个一模一样的html，然后双击打开也好、服务器打开也好，有两个就可以了。 下面，我们把桥接的iframe叫做bridge.html吧。...sub <iframe src="http://localhost:1000...允许我们创建一个新的消息通道，并通过它的两个MessagePort 属性发送数据m，而且在 Web Worker 中可用。可以控制台打印，发现有两个属性，portl1和port2。
loop：设置循环播放，当设置了loop：loop后，当音频结束时继续播放该音频。preload：设置后，音频在页面加载时加载，并预备播放，如果使用autoplay则可以忽略该属性。src：音频路径。...，但是不允许出现音频、视频、表单元素、iframe等交互式内容 关于锚点 H5中，a标签如果没有设置href时，只是链接的占位符，而不再是一个锚点, H4中没有设置href可以当做锚点使用 创建用于链接的锚点的一般方法...——任何定义了ID值的元素都可以作为锚点标记，给标签的ID锚点命名时不要含有空格，同时不要置于绝对定位元素内，为a标签设置href属性，属性值设为“#+锚点名称”，如“#p4”，如果链接到不同页面，则设置如...“demo.html#p4”可以使用相对路径也可以使用绝对路径，但是锚点名称是区分大小写的 有download和没有的比较 下载图片...shape——定义区域的形状（有default，rect（矩形），circ（圆形），poly（多边形）） target——规定在何处打开href的目标URL 框架链接 <iframe src
下面针对前端工程师的知识点展开介绍： 1. 务必掌握HTML（标签，属性，语义化）等。 2. 务必掌握CSS（文档流，盒模型，浮动，定位，继承，浏览器兼容性）等。 3....7.锚点的使用方式： id="" name="" dadaqianduan 8.结构标签： 用于定义文档的页眉 用于定义页面的导航链接部分...16.使用iframe，可以解决加载缓慢的第三方内容，可以实现安全沙箱，可以并行加载脚本。但是使用iframe会阻塞主页面的Onload事件。...5.如果对内联元素设置float和absolute属性，让元素脱离文档流，并且可以设置其宽高。...17.浏览器的标准模式和怪异模式区别在于盒子模型的渲染模式不同，可以使用window.top.document.compatMode判断当前模式为何为何种模式。
下面针对前端工程师的知识点展开介绍： 务必掌握HTML（标签，属性，语义化）等。 务必掌握CSS（文档流，盒模型，浮动，定位，继承，浏览器兼容性）等。...7.锚点的使用方式： id="" name="" dadaqianduan 8.结构标签： 用于定义文档的页眉 用于定义页面的导航链接部分...16.使用iframe，可以解决加载缓慢的第三方内容，可以实现安全沙箱，可以并行加载脚本。但是使用iframe会阻塞主页面的Onload事件。...5.如果对内联元素设置float和absolute属性，让元素脱离文档流，并且可以设置其宽高。...17.浏览器的标准模式和怪异模式区别在于盒子模型的渲染模式不同，可以使用window.top.document.compatMode判断当前模式为何为何种模式。
同源策略限制了从同一个源加载的文档或脚本如何与来自另一个源的资源进行交互。这是一个用于隔离潜在恶意文件的重要安全机制。 那么，何为同源呢？...浏览器的同源策略，出于防范跨站脚本的攻击，禁止客户端脚本（如 JavaScript）对不同域的服务进行跨站调用（通常指使用 XMLHttpRequest 请求）。...现代浏览器使用CORS在API容器如XMLHttpRequest来减少HTTP请求的风险来源。与 JSONP 不同，CORS 除了 GET 要求方法以外也支持其他的 HTTP 要求。...iframe 标签的跨域能力； window.name 属性值在文档刷新后依旧存在的能力（且最大允许2M左右）。...重新设置 src（http://localhost:10000/proxy.html）后导致页面不断刷新，所以通过 state 来控制； 全部获取完结果后，清除该 iframe。
它用于限制从一个源（origin）加载的文档或脚本，如何与另一个源（origin）的资源进行交互。...如果两个 URL 的 protocol、port (如果存在)和 host 都相同的话，则这两个 URL 是同源。 IE 未将端口号纳入到同源策略的检查中。 1.2. 同源策略限制了什么？...具体来说，就是在 DOM 中通过动态创建 标签，并给标签设置 src 属性，在访问请求参数中传递需要回调的函数名；同时，服务端在响应 JSONP 请求时，将数据作为请求参数指定的客户端回调函数参数作为返回值...三个页面，不同域之间利用iframe的location.hash传值，相同域之间直接js访问来通信。...使用此API，您可以向服务器发送消息并接收事件驱动的响应，而无需通过轮询服务器的方式以获得响应。
，该iframe的src指向服务器文件的地址（iframe标签src可以跨域），服务器文件里设置好window.name的值，然后再在index.html里面读取改iframe中的window.name...因为规定如果index.html页面和和该页面里的iframe框架的src如果不同源，则也无法操作框架里的任何东西，所以就取不到iframe框架的name值了，告诉你我们不是一家的，你也休想得到我这里的数据...： iframe标签的跨域能力 window.names属性值在文档刷新后依然存在的能力 location.hash + iframe 跨域 此跨域方法和上面介绍的比较类似，一样是动态插入一个iframe...关于锚点相信大家都已经知道了，其实就是设置锚点，让文档指定的相应的位置。锚点的设置用a标签，然后href指向要跳转到的id，当然，前提是你得有个滚动条，不然也不好滚动嘛是吧。...而location.hash其实就是url的锚点。
0x02 通过document.domain跨域 前面说过了，浏览器有一个同源策略，其限制之一是不能通过ajax的方法去请求不同源中的文档。...对象 var name = win.name;//这里同样获取不到window对象的name属性 } <iframe id = "iframe" src...在页面http://www.damonare.cn/a.html 中设置document.domain: <iframe id = "iframe" src="http://damonare.cn/b.html...下面举例说明： 假如父页面是baidu.com/a.html,iframe嵌入的页面为google.com/b.html（此处省略了域名等url属性），要实现此两个页面间的通信可以通过以下方法。...iframe，此iframe的src是baidu.com域下的，并挂上要传送的hash数据，如src=”http://www.baidu.com/proxy.html#data” proxy.html
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
