如何获取js生成内容的 完整的html代码

如何获取js生成内容的 完整的html代码,第1张

获得JS生成后的HTML代码,首先需要要获取的是那一段代码,然后在通过innerHTML这个JS的方法来调用,然后在输出这段方法就行了;

代码:

<html>

<head></head>

<script>

var oDiv = documentgetElementById('div1');

alert(oDivinnerHTML);

</script>

<body>

<div id='div1'>

<p>会被获取的</p>

</div>

/body>

</html>

这样就能获取到JS生成后的html代码。

1、js中获取当前屏幕宽度方法如下:

网页可见区域宽: documentbodyclientWidth

网页可见区域高: documentbodyclientHeight

网页可见区域宽: documentbodyoffsetWidth (包括边线的宽)

网页可见区域高: documentbodyoffsetHeight (包括边线的高)

网页正文全文宽: documentbodyscrollWidth

网页正文全文高: documentbodyscrollHeight

网页被卷去的高: documentbodyscrollTop

网页被卷去的左: documentbodyscrollLeft

网页正文部分上: windowscreenTop

网页正文部分左: windowscreenLeft

屏幕分辨率的高: windowscreenheight

屏幕分辨率的宽: windowscreenwidth

屏幕可用工作区高度: windowscreenavailHeight

屏幕可用工作区宽度: windowscreenavailWidth

2、js简介

js,是JavaScript的缩写,是一种直译式脚本语言,一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。

avaScript是的源代码在发往客户端运行之前不需经过编译,而是将文本格式的字符代码发送给浏览器由浏览器解释运行。直译语言的弱点是安全性较差,而且在JavaScript中,如果一条运行不了,那么下面的语言也无法运行。

1、拖动后记录x,y值

给div加上mousePosition事件

function mousePosition(evt){  

evt = evt || windowevent;

return {

x : evtclientX + documentbodyscrollLeft - documentbodyclientLeft,

y : evtclientY + documentbodyscrollTop - documentbodyclientTop

}

}

2、打开页面div定位

$(“div”)attr("top",y)attr("left",x);

扩展资料

在用js获取元素的位置之前,元素在页面的位置的计算公式,如下:

元素在页面的位置=此元素相对浏览器视窗的位置+浏览器滚动条的值;

用getBoundingClientRect()方法来获得某个元素相对浏览器视窗的位置 {这个方法返回的是一个对象,即Object,该对象具有4个属性:top,left,right,bottom }。

<html >

<head>

<meta >

<title>Demo</title>

</head>

<body style="width:2000px; height:1000px;">

<div id="demo" style="position:absolute; left:518px; right:100px; width:500px; height:500px;

background:#CC0000; top: 114px;">Demo为了方便就直接用绝对定位的元素</div>

</body>

</html>

<script>

documentgetElementById('demo')onclick=function (){

if (documentdocumentElementgetBoundingClientRect) {

alert("left:"+thisgetBoundingClientRect()left)

alert("top:"+thisgetBoundingClientRect()top)

alert("right:"+thisgetBoundingClientRect()right)

alert("bottom:"+thisgetBoundingClientRect()bottom)

var X= thisgetBoundingClientRect()left+documentdocumentElementscrollLeft;

var Y = thisgetBoundingClientRect()top+documentdocumentElementscrollTop;

alert("Demo的位置是X:"+X+";Y:"+Y)

}

}

</script>

附上代码:

<!DOCTYPE html>

<html>

<head>

<script>

function mousePosition(evt){

evt = evt || windowevent;

var xPos = evtpageX || evtclientX || evtoffsetX || evtx;

var yPos = evtpageY || evtclientY || evtoffsetY || evty;

return [xPos, yPos];

}

function moveWindow (e) {

documentonmousemove = function(e){

resultinnerHTML = mousePosition(e);

};

}

onload = moveWindow;

</script>

</head>

<body>

<div id="result">

<!-- 展示结果 -->

</div>

</body>

</html>

        //返回body下所有对象数组

        function getAll() {

            var objs = documentall;

            var length1;

            for (var i = 0; i < objslength; i++) {

                var obj = objs[i]tagName;

                if (obj == "body" || obj == "BODY") {

                    length1 = i+1;

                    break;

                }

            }

            var b_objs = new Array();

            for (var j = length1; j < objslength; j++) {

                b_objspush(objs[j]);

            }

            return b_objs;

        }

js没有提供获得body下的所有元素集合,只提供了获得全部标签的documentall

以上就是关于如何获取js生成内容的 完整的html代码全部的内容,包括:如何获取js生成内容的 完整的html代码、js中怎么获取当前屏幕宽度、js获取div到body左侧距离等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/web/9376542.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-27
下一篇 2023-04-27

发表评论

登录后才能评论

评论列表(0条)

保存