[TOC]
# 方法一:获取子页面高度(高度是固定的)
### 1.ifram标签里的内容
~~~
<iframe src="1.1.html" id="external-frame" frameborder="0" name="iframe-a" width="100%"onload="setIframeHeight(this)" scrolling="no"></iframe>
~~~
### 2.链接地址
~~~
<li> <a href="../1.2.html" target="iframe-a">关于公司</a></li>
~~~
### 3.JavaScript 代码
~~~
<script>
// document.domain = "caibaojian.com";
function setIframeHeight(iframe) {
if (iframe) {
var iframeWin = iframe.contentWindow || iframe.contentDocument.parentWindow;
if (iframeWin.document.body) {
iframe.height = iframeWin.document.documentElement.scrollHeight || iframeWin.document.body.scrollHeight;
}
}
};
window.onload = function () {
setIframeHeight(document.getElementById('external-frame'));
};
</script>
~~~
# 方法二:获取子页面高度(高度可变 响应式)
### 1.ifram标签里的内容
~~~
<iframe src="1.1.html" frameborder="0" name="iframe-a" width="100%" id="test" onload="this.height=100"scrolling="no"></iframe>
~~~
### 2.链接地址
~~~
<li> <a href="../1.2.html" target="iframe-a">关于公司</a></li>
~~~
### 3.JavaScript 代码
~~~
<script type="text/javascript">
function reinitIframe(){
var iframe = document.getElementById("test");
try{
var bHeight = iframe.contentWindow.document.body.scrollHeight;
var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;
var height = Math.max(bHeight, dHeight);
iframe.height = height;
console.log(height);
}catch (ex){}
}
window.setInterval("reinitIframe()", 200);
</script>
~~~
[参考网站:]("http://caibaojian.com/iframe-adjust-content-height.html")
- JavaScript介绍
- js基本语法
- 调试方法
- 标识符
- 数据类型(基本,引用)
- 基本数据类型
- 引用数据类型
- 严格模式.
- 全局变量和局部变量
- DOM 节点
- DOM 改变元素内容(样式 内容)
- 节点改变元素内容(通过父子节点找到元素然后操作)
- 添加元素
- 设置 移除 属性
- DOM下的事件
- 知识点整理
- 异步
- Ajax
- this指向问题
- 设备类型检测(手机 平板 电脑)
- 函数
- 函数的参数
- 重载
- 数据类型
- 构造函数
- 返回上一个网页
- 数组 (重点)
- 增加数组内容
- 删除数组元素
- 复制数组
- 修改数组元素(功能强大实现 增 删 改)
- 数组元素查询
- 数组遍历
- 最值
- 展开语法
- join
- 排序问题
- 求和
- 颠倒数组
- 判断是不是一个数组
- 二维数组
- 数组和字符串之间转换
- 数组去重
- 将jquery对象转为javascript对象
- 元素偏移量
- 获取一个元素距离顶部的距离
- 可视区域宽高
- 布局视口 (移动设备)
- 文档碎片
- 表格中的 thead tbody
- 获取元素宽度
- 滚动区域宽高
- div滚动条设置
- 使用 offsetWidth 设置父元素宽度和子元素宽度之和一样
- 字符串的方法
- js功能实现
- 点击显示 隐藏
- 点击变色 兄弟元素隐藏.
- 点击显示隐藏区域.
- 兼容性问题.
- 选择按钮,
- 获取外部样式
- 点击弹出下标
- 通过属性改变img 的src
- 小米登录 es6实现js
- try catch
- 小米登录es5实现js
- js实现导航栏点击加载多个页面
- js实现网页之间的跳转和在指定div加载页面
- iframe 高度实现自适应
- js 获取滚动条距离顶端的距离
- jQuery animate() 方法 动画效果
- fade(js实现遮罩层渐变色)
- js轮播实现
- 超哥轮播js
- 轮播动画原理
- 数组实现瀑布流
- 电子表计时器date
- 从豆瓣接口上取数据实现搜索功能(重点!!!!)
- 封装
- 不使用js-ajax 使用VueResource实现数据请求
- 需要常看的知识点
- 移动端响应布局rem
- rem+vw
- 原型
- JS的模块化如何解决
- ES5和ES6模块化写法
- js内置对象
- 结构赋值es6
- 字符串模板 分割字符串
- 谈基本数据类型中的方法(本不带有方法)
- Math
- date
- 正则
- 备选字符集
- 连号的备选字符集
- replace() 查找替换(过滤)
- 量词
- 不确定的数量
- search找下标
- test()检验是否包含正则表达式
- 实例
- 验证电话号码
- 邮箱验证
- 将指定内容过滤(天猫 淘宝)
- 预定义字符集(简化)
- 严格匹配 ^ $
- Ajax
- http get post
- $.get()和$.post()详解
- jquery-ajax 数据请求
- 使用Vue Ajax在网页中渲染数据
- axios向服务器端get,post数据(重点)
- 跨域
- 原生Ajax
- 原理步骤 json解析字符串
- 多态
- js中的面向对象
- js中的类和继承
- 原型和原型链
- 参数表达式
- 字符串中常用的方法
- mock.js
- scrollReveal 滚动显示
- Node.js模块里exports与module.exports的区别