web使用iframe

Web前端之iframe详解

iframe基本内涵通常我们使用iframe直接直接在页面嵌套iframe标签指定src就可以了. <iframe src="demo_iframe_sandbox.htm"></iframe> 但是,有追求的我们,并不是想要这么low的iframe. 我们来看看在iframe中还可以设置些什么属性 iframe常用属性: 1.frameborder:是否显示边框,1(yes),0(no) 2.height:框架作为一个普通元素的高度,建议在使用css设置.

【归纳整理】Ajax / JSON / WEB存储 / iframe

Ajax 一.什么是 AJAX ? AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML). AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. 传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面. 有很多使用 AJAX 的应用程序案例:新浪微博.Google 地图.开心网.百度搜

web自动化测试--iframe切换

什么是iframe切换,我们在测试web网页过程中,可能会遇到一个网页中嵌套另一个网页的情况,如下图,就是一个ifame嵌套的例子我们如何切换呢,别急,webdriver里有方法,可以切换到iframe里面 1.方法一:driver.switch_to.frame(iframe_name) iframe_name:1.可以是name属性 2.webElement对象(by.xpth表达式) 3.下标值 #iframe切换from selenium import webdriverfrom se

百度百科Tooltip的实现--原生js的应用

我们在浏览百度百科时,不难发现提示框的存在,如下图: 实现如下: 1.HTML代码部分 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Tooltip提示框</title> <meta name="keywords" content=""> <meta

APP自动化 -- contexts（上下文切换）

一.上下文是什么? 1.解释 1)在混合型APP中包含了原生页面和 H5页面,如果需要进入APP内嵌的H5页面里面去操作就需要先切换进去,如果要继续回到原生页面操作就需要切回来. 2)这个就像是web的iframe切换或者window切换一个道理. 2.上下文的类型 1)原生安卓:NATIVE_APP(大写小严格) 2)H5:WEBVIEW_包名(大写小严格) 二.上下文切换的前提 APP的DEBUG属性要开启,开启后appium才能识别到webview,能识别到才能进行切换. 三.上下文

【转】轮询、长轮询、iframe长连接、web socket

引自:http://www.cnblogs.com/AloneSword/p/3517463.html http://www.cnblogs.com/wei2yi/archive/2011/03/23/1992830.html 代码示例: 1.iframe实现长连接 <%@ page language="java" contentType="text/html; charset=GB18030" pageEncoding="GB18030"

[Flex] IFrame系列 —— 在flex的web应用中嵌入html的方法

在flex的web应用中,我们往往必须有嵌入html的需求,这时候你会发现IFrame很有用! flex而且可以和html中的JavaScript进行交互,flex可以通过iframe调用到html中的JavaScript方法以及获取调用后的返回值. flex iframe下载地址:https://github.com/downloads/flex-users/flex-iframe/flex-iframe-1.5.1.zip bin有需要用到的flex库 swc flex代码: <?xml v

【Egret】里使用iframe标签达到内嵌多个web界面

目的:Egret里使用iframe标签达到内嵌多个web界面,模式相当于主swf调用N个子swf的效果: 目前在做项目过程中,在使用iframe的时候,碰到了一些功能需求,以及解决方法如下: 一..在index.html里添加iframe标签, 在index.html的<body>标签下,添加iframe标签,包括:路径,宽,高,坐标X,Y,是否出现滚动条,等属性: 想要详细了解其意思的话,请阅读 http://www.w3school.com.cn/tags/tag_iframe.asp 有

利用 postMessage 进行数据传递（iframe 及web worker）及问题

一 postMessage应用于主页面和iframe之间进行数据的传递 1 子iframe页面向主页面进行数据传递: // 多个子iframe需要将自己的计数统计到主页面进行数据上报 window.parent.postMessage({ count:count(), id:'1' },'*'); // 主页面进行接收 window.onmessage = (e)=>{ if(!e.data.id) return; var id = e.data.id; var count = e.data.

移动端web页面列表类上拉加载，查看详情，iframe嵌套第三方页面遇到的问题以及解决办法

1.移动端上拉加载网上有很多成熟的插件,比如iscroll.在这里介绍一下用jquery和js写的上拉加载方法.使用原生的去写上拉加载更多需要三个高度去做对比,以新闻类列表举例,首先需要整个dom的高度,其次需要移动设备窗口的高度,最后需要滚动条距离顶部的高度,移动设备的高度加上滚动条距离顶部的高度等于dom的高度时,表示已经滑动到底部,进而加载下一页,监听滚动条的滑动事件使用scroll()方法.当然这里也可以进行无感知加载,就是当移动设备高度和滚动条高度相加和dom高度接近时就加载下一页的

Saiku通过iframe嵌入web页面（六）

Saiku通过iframe嵌入系统页面前提: Saiku已安装好,并且配置了数据源,熟练了saiku的基本使用. 一.将整个Saiku嵌入页面在web项目中,新建index.jsp页面,内容如下: http://10.22.33.44:8080 是我本机访问 Saiku 的 url <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8

html Frame、Iframe、Frameset 的区别详细出处参考：http://www.jb51.net/web/22785.html

10.4.1 Frameset与Frame的区别首先讲解Frameset与Frame之间的区别. 用来划分框架,每一个框架由标记.必须在之内使用,代码如下: 在上面的例子当中,把页面分为左右两个部分,左侧框架中的页面是admin_left.htm,右侧框架中的页面是admin_center.htm. 注意:标记的框架顺序为从左至右或从上到下. 两者的差别如下: ● 为框架标记,说明该网页文档为框架组成,并设定文档中组成框架集的框架的布局. ● 用以设置组成框架集中各个框架的属性. 10.4.2

web 开发之js---巧用iframe实现jsp无刷新上传文件

首先要说的就是 ajax 是无法实现上传文件的,可以想一下ajax与后台通信都是通过传递字符串,怎么能传递文件呢?其实出于安全考虑js是不能操作文件的,所以就不要再说用ajax来实现文件的上传了,这是不可能的. 而本文实现的文件上传也是无页面刷新的,可以说是一种"类似AJAX"方法. 开始之前先说两句无关的,其实在ajax出现之前,web应用也可以是无刷新的,那时大多通过IFrame来做到这一点.当然Ajax出现之后,人们一窝蜂地投奔Ajax 的阵营了,iFrame 就乏人

响应式web布局中iframe的自适应

困境在响应式布局中,我们应该小心对待iframe元素,iframe元素的width和height属性设置了其宽度和高度,但是当包含块的宽度或高度小于iframe的宽度或高度时,会出现iframe元素溢出的现象: 这样溢出的iframe会破坏页面的布局.我们可以采用一种方法让iframe元素也具有响应性,拭目以待. 方案 iframe元素本身并无法伸缩,除非通过js显示的设置其宽度.但是我们可通过一个iframe-container元素来包裹iframe,同时让iframe-container元

那些年，我们在Django web开发中踩过的坑（一）——神奇的‘/’与ajax+iframe上传

一.上传图片并在前端展示为了避免前端整体刷新,我们采用ajax+iframe(兼容所有浏览器)上传,这样用户上传之后就可以立即看到图片: 上传前: 上传后: 前端部分html: <form style="display: inline-block" id="upload_img_form" name="form" action="/upload/" method="POST" enctype=&qu

JS调用iframe方式实现Web区域打印页面内容

1.程序说明 1) 此程序可以实现选择页面中的区域进行打印,以iframe方式进行打印: 2) 与原生态的print() 区别在于,取消打印页面后可以完整保留当前访问页面的内容. 2.代码部分 1) JS 函数: 代码如下复制代码 function do_print(id_str)//id-str 打印区域的id{ var el = document.getElementById(id_str); var iframe = document.createElement('

web 文件上传无刷新的方法使用iframe

<html> <script type="text/javascript" src="admin/view/js/jquery.min.js"></script> <body> <form action="t.php" encType="multipart/form-data" method="post" target="hidden_fram

第三方页面嵌入到web项目的方案之使用iframe嵌入

有些项目中可能会遇到这样的需求, 需要在一个项目中嵌入其他的项目的页面或者功能.并且需要这两个页面之间能够进行交互. 本文主要介绍如何实现这种第三方应用的嵌入, 主要有以下几个方向: 1.iframe引入第三方应用 2.嵌入js片段 3.封装成SDK 本篇将主要介绍第一种, 通过iframe嵌入第三方页面, 接下来的几篇文章将分别介绍其他两种方式使用iframe嵌入是目前使用很广泛的一种嵌入方案, 先看几个案例: 一. 使用案例搜狐移动端使用iframe嵌入广告: 移动端视频网站使用ifra

广告等第三方应用嵌入到web页面方案之使用iframe嵌入

有些项目中可能会遇到这样的需求, 需要在一个项目中嵌入其他的项目的页面或者功能.并且需要这两个页面之间能够进行交互. 本文主要介绍如何实现这种第三方应用的嵌入, 主要有以下几个方向: 1.iframe引入第三方应用 2.嵌入js片段 3.封装成SDK 本篇将主要介绍第一种, 通过iframe嵌入第三方页面, 接下来的几篇文章将分别介绍其他两种方式使用iframe嵌入是目前使用很广泛的一种嵌入方案, 先看几个案例: 一. 使用案例搜狐移动端使用iframe嵌入广告: 移动端视频网站使用ifra

跟bWAPP学WEB安全(PHP代码)--HTML注入和iFrame注入

背景这里讲解HTML注入和iFrame注入,其他的本质都是HTML的改变.那么有人会问,XSS与HTML注入有啥区别呢?其实本质上都是没有区别的,改变前端代码,来攻击客户端,但是XSS可以理解为注入了富文本语言程序代码,而HTML注入只注入了超文本标记语言,不涉及富文本程序代码的问题.这里的iframe注入实际上就是一个阅读器,可以阅读通过协议加载的活服务器本地的文件. HTML注入在这里不在区分GET和POST,没有任何意义,只看一下反射和存储. 没有防御--简单级一般防御--中等级直

web使用iframe

热门专题