问题标签 [html-rendering]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
498 浏览

javascript - 使用 JavaScript 和 jQuery 计算大小

有时我会遇到问题,试图获取有问题的 HTML 元素的大小。

我正在跟踪 JavaScript 代码,看到这个元素的宽度和高度返回为 0。

当我在浏览器的控制台中执行相同的代码时,会返回正确的大小。

演示此问题的示例代码如下:

这段代码需要一个图像,包裹在锚点上并用“播放”按钮装饰它,它必须居中。

表格单元格用于居中。

在 Firefox 中它运行良好,但在 Safari 5 中则不行。

当我们跟踪代码时,“w”和“h”变量获取宽度和高度时,我们会看到它们的值为零。

当我们从浏览器的控制台说

我们将获得正确尺寸的图像。

我想,我错过了一些东西......

我认为,我必须捕捉“渲染完成”之类的事件......但是,据我所知,它们并没有出现在 DOM 中。

我如何才能知道,当 HTML 元素被渲染并显示为 100% 确定时,我正在处理正确的尺寸?

0 投票
1 回答
904 浏览

safari - 更改 Safari 和 Chrome 浏览器高度时 div 消失

使用 Safari 或 Chrome 浏览器访问此 URL:http: //aspspider.net/sunlight1000/two_col_div_layout_w3valid.htm 设置浏览器窗口的宽度以确保绿色框的高度大于红色框的高度。然后抓住浏览器窗口的下边缘并将其拖到绿色框的下边缘并在它周围播放。当浏览器窗口的下边缘高于绿色框的下边缘时,您会注意到红色框消失。然后继续缩小浏览器窗口的高度,红色框会再次出现。您会注意到,当浏览器窗口的下边缘到达红框的下边缘时,红框再次出现。在其他浏览器(IE、FF 和 Opera)中,红色框永远不会消失。这是 Safari 中的错误还是某种“功能”?无论如何,如果有人向我建议一种解决方法以避免 Safari 中的红色框消失,我将不胜感激。

0 投票
4 回答
1220 浏览

html - 我的 html 没有在页面上呈现什么?

我有这个页面

http://kornar.co.uk/example.html

但它不会呈现 HTML。我知道它在那里,因为当我检查view sourceHTML 代码在那里时,在我的本地主机上它运行良好,感谢您的帮助!

0 投票
2 回答
4684 浏览

java - 如何使用 Java 呈现 HTML?

我正在用 Java 构建一个 Web 浏览器。我使用了解析器 (JTIDY) 将 HTML 页面解析为 DOM 文档。我知道渲染意味着 DOM 文档的图形表示。但是我不知道Java中HTML渲染的工程过程是什么。在 Java 中有一个 JEditorkit 来解析和渲染,但它的格式不是很好。所以我想要一个更好的解决方案。

我的问题是:在 Java 中 HTML 渲染和显示完整网页的实际过程是什么?

0 投票
1 回答
2149 浏览

html - CSS3 旋转渲染元素以使它们重叠浮动

正如标题所描述的,我对一些 CSS3 的东西有疑问。在我的网站中,我使用了article几个

(加上三个浏览器供应商前缀,为简洁起见省略)

为了使内容保持直立(仅旋转背景),我使用以下方法将文章内的所有元素旋转回来

在文章内部(它们是博客文章)通常有几个p's,有时里面有一个浮动图像。但是,当我像这样浮动图像时:

第二个<p>将在图像的左侧结束(因为它是浮动的),但因为它是一个块级元素,它将占据整个宽度article并与浮动图像重叠,使得链接在某些地方不可点击。当我禁用时,transform: rotate这不会发生,所以我认为它与渲染旋转的方式有关。问题出现在 Chrome 和 FireFox,IE 不支持旋转和 Opera 我没有测试过。

有人知道如何解决吗?

(例如: http: //www.stephanmuller.nl/portfolio/stephanmuller-nl/

0 投票
4 回答
2673 浏览

html - 我如何知道 HTML 何时完全呈现

情况1:

我加载了一个非常大的 HTML 页面,其中包含许多复杂的布局和字体。该页面将花费一些未知的时间来呈现。

案例2:

我使用 jquery .html() 函数对我的 DOM 进行重大更改。修改后的 DOM 将花费一些未知的时间来呈现。

在这两种情况下,我都希望能够用微调器覆盖整个屏幕,直到页面完全完成渲染

在寻找这个问题的答案时,我发现了类似的问题,但答案并不相关。要清楚:

我不想知道 DOM 什么时候准备好。

我不想知道何时获取了 HTTP 数据。

我想知道 DOM 中的所有内容何时已完全绘制到屏幕上

设置一些最坏情况的超时不是可接受的解决方案。

我需要基于 WebKit 的浏览器的解决方案。

0 投票
2 回答
2487 浏览

html - Mobile Safari (iPad) 中的背景图像渲染问题

在使用 Mobile Safari 和 iOS 浏览我的网页时,我遇到了一个简单但意外的渲染问题。

基本上,我的页面有标签,它们由三个 div 和标签中心 div 内的“a href”组成。两侧的 div 包含背景,而在中心的链接有图像。出于某种原因,a href 的背景在 Mobile Safari 上显示水平黄线:

http://i.stack.imgur.com/jlKHf.jpg

在桌面浏览器上它工作正常:

[无法添加另一个链接,它应该是白色的]

我尝试了不同的图像,没有成功。我尝试将背景添加到中心 div,但没有成功。知道发生了什么吗?

提前致谢。

0 投票
4 回答
3301 浏览

html - 用于测量 html 渲染时间的工具

我的网站 (1.3MB) 有速度问题。该问题在 Internet Explorer (7,8) 中尤为重要。现在我正在寻找一种测量渲染时间的工具(HTML、JavaScript、CSS)。

感谢帮助 !

此致

0 投票
1 回答
621 浏览

php - 如何拍摄网页的完整快照?(可滚动尺寸大)

我想拍摄网页的快照。该图像应显示浏览器窗口的全部内容(我的意思是没有滚动条)。

我想使用 PHP 脚本动态地执行此操作。

0 投票
1 回答
1294 浏览

html - 为什么 HTML 的渲染是一个 cpu 密集型的过程?

人们经常说 html 渲染性能的门控因素是 cpu。我还通过单独增加 cpu 速度、内存量和磁盘速度看到了这一点,影响 html 渲染的唯一变化是 cpu,

为什么 HTML 的渲染是一个 cpu 密集型过程(或者换一种说法,为什么 cpu 速度是 html 渲染中的门控因素)?