(js有关图片加载问题)dom加载完和onload事件
引用旺旺的话。。。哈哈哈
DOMContentLoaded事件表示页面的DOM结构绘制完成了,这时候外部资源(带src属性的)还没有加载完。
而onload事件是等外部资源都加载完了就触发的。
$.ready()里的事件就是DOMContentLoaded。
贴代码:
此代码用于图片加载完以后,得到它相关属性。
var addEvent = function (element, eventType, fn) {
if (window.addEventListener) {
element.addEventListener(eventType, fn, false);
} else if (window.attachEvent) {
element.attachEvent("on" + eventType, fn);
}
}
addEvent(window, "load", function () {
$(".textVersion").each(function () {
var $dom = $(this);
if ($dom.data("info").TextAlign == 1 || $dom.data("info").TextAlign == 2) {
$(this).attr("orgwidth", $dom.width());
}
});
for (i = 0, l = TextJson.length; i < l; i++) {
if(TextJson[i].Type==1)
{
TextJson[i].TemplateTransactionID == symbol.frontId
? $("#lists ul").append("<li><input class=\"y_inp\" maxlength=\"100\" id=\"ipt-" + TextJson[i].TextPropertyId + "\" value=\"" + TextJson[i].Text + "\" type=\"text\" rel='#text-" + TextJson[i].TextPropertyId + "'/></li>")
:
$("#lists1 ul").append("<li><input class=\"y_inp\" maxlength=\"100\" id=\"ipt-" + TextJson[i].TextPropertyId + "\" value=\"" + TextJson[i].Text + "\" type=\"text\" rel='#text-" + TextJson[i].TextPropertyId + "'/></li>");
}
}
});
(js有关图片加载问题)dom加载完和onload事件的更多相关文章
- 原生JS实现AJAX、JSONP及DOM加载完成事件,并提供对应方法
JS原生AJAX ajax:一种请求数据的方式,不需要刷新整个页面: ajax的技术核心是 XMLHttpRequest 对象: ajax 请求过程:创建 XMLHttpRequest 对象.连接服务 ...
- 原生JS实现AJAX、JSONP及DOM加载完成事件
一.JS原生Ajax ajax:一种请求数据的方式,不需要刷新整个页面:ajax的技术核心是 XMLHttpRequest 对象:ajax 请求过程:创建 XMLHttpRequest 对象.连接服务 ...
- HTML5 JS 压缩图片,并取得图片的BASE64编码上传
基本过程 1) 调用 FileReader 的 reader.readAsDataURL(img); 方法, 在其onload事件中, 将用户选择的图片读入 Image对象. 2) 在image对象的 ...
- js 实现图片预加载 (js操作 Image对象属性complete ,事件onload 异步加载图片)
通过js操纵DOM很多情况下都是为了实现和当前页html元素的异步载入,我谈谈对Image对象的一些认识.看个例子:<input type="button" name=&qu ...
- JS实现图片懒加载插件
一.前言 我在前几篇博客的记录中,有说自己在做一个图片懒加载的功能,然后巴拉巴拉的遇到哪些问题,结果做完了也没对懒加载这个功能做一些记录,所以这篇文章主要针对我所实现的思路,以及代码做个记录,实现不佳 ...
- js实现类型jq的dom加载完成
有时候我们只想在 dom 加载完成后运行 js ,而不是等所有图片加载完成.所以不需要 onload , onload 会加载图片等其他媒体.很消耗时间. 原:http://blog.csdn.net ...
- js判断图片是否加载完毕
附件: https://www.jb51.net/article/102385.htm 问题: .offset().top和$(window).scrollTop()每次刷新页面后滚动的值有时候会不 ...
- 如何使用echo.js实现图片的懒加载(整理)
如何使用echo.js实现图片的懒加载(整理) 一.总结 一句话总结:a.在img标签中添加data-echo属性加载真实图片:<img class="loading" sr ...
- JS实现图片预加载无需等待
网站开发时经常需要在某个页面需要实现对大量图片的浏览;用javascript来实现一个图片浏览器,让用户无需等待过长的时间就能看到其他图片 网站开发时经常需要在某个页面需要实现对大量图片的浏览,如果考 ...
随机推荐
- CodeForces 173B Chamber of Secrets spfa
Chamber of Secrets 题目连接: http://codeforces.com/problemset/problem/173/B Description "The Chambe ...
- Swift - 初次使用:
今天Apple放出了新的编程语言.然后下载了Xcode6把系统升级到Mac OS 10.9.3 (Xcode6的系统最低要求). 创建了一个项目,折腾半天 都不知道怎么导入一个ViewControll ...
- 放肆的使用UIBezierPath和CAShapeLayer画各种图形
CAShapeLayer 是 CALayer 的子类,但是比 CALayer 更灵活,可以画出各种图形,当然,你也可以使用其他方式来画,随你. 杂谈 在 CAShapeLayer 中,也可以像 CAL ...
- 大型JavaScript应用程序架构模式
11月中旬在伦敦举行的jQuery Summit顶级大会上有个session讲的是大型JavaScript应用程序架构,看完PPT以后觉得甚是不错,于是整理一下发给大家共勉. PDF版的PPT下载地址 ...
- 可以将一些配置信息已json格式存在数据库中读取的时候序列化。
public partial class json序列化 : System.Web.UI.Page { protected void Page_Load(object sender ...
- Linux合并文件、去除重复行的命令
Linux合并文件命令: awk '{printf("%s\n",$0)}' YQ-*101?.txt > 123.txt linux去除重复行命令:cat YQ-10 ...
- HTML目录
1. 表格标记 2. HTML常用标记 3. 博客园添加访问人数统计 4. 如何快速掌握CSS(各种CSS工具) 5. HTTP协议状态码详解(HTTP Status Code)(转)
- c#使用MethodInvoker解决跨线程访问控件
功能函数测试集锦(77) C#专区(114) 版权声明:本文为博主原创文章,未经博主允许不得转载. .net 原则上禁止跨线程访问控件,因为这样可能造成错误的发生,有一种方法是禁止编译器对跨线 ...
- Python高级编程–正则表达式(习题)
原文:http://start2join.me/python-regex-answer-20141030/ ############################################## ...
- Linux上安装Mysql+Apache+Php
一.安装Mysql 1.卸载默认的mysql yum -y remove mysql-libs-* Removed: mysql-libs.x86_64 0:5.1.73-3.el6_5 卸载成功 ...