Question

我想用javascript创建一个新的html文档。在我想要的身体中创建一个div（显示：内联），并在那里有一个p标签。然后我在p标签（innerHTML）中放入一个String（titleTagString）。现在我想知道，这是div的偏移宽度。 Chrome控制台说0 ... 失败在哪里？谢谢！

＆＃13;

function titleTagTester(titleTagString) {
  //Create new document
  newDoc = document.implementation.createHTMLDocument('titleTagTester.html');
  //Create var body from document
  var body = newDoc.getElementsByTagName('body');
  
  //Create div element with style and add to body of document  
  newDoc.body.innerHTML += '<div style="width:600px" display="inline" id="divId"></div>';
  
  //Create p element with style and add to div of body of document  
  newDoc.getElementById('divId').innerHTML += '<p style="color:#1a0dab" "font-family:arial" font-size:18px;">' + titleTagString + '</p>';
  
  //getwidth of div
  return newDoc.getElementById("divId").offsetWidth;
}

＆＃13;

Answer 1

我制作了一个HTML文档，其中嵌入了脚本，以便脚本操作相同的文档DOM：

＆＃13;

<!DOCTYPE html>
<html>
<head>
<title>temp</title>
</head>
<body>
<h1>Domething</h1>
</body>
<script type="text/javascript">
function titleTagTester(titleTagString) {
  var body = document.getElementsByTagName('body');
  
  //Create div element with style and add to body of document  
  document.body.innerHTML += '<div style="width:600px" display="inline" id="divId"></div>';
  
  //Create p element with style and add to div of body of document  
  document.getElementById('divId').innerHTML += '<p style="color:#1a0dab" "font-family:arial" font-size:18px;">' + titleTagString + '</p>';
  
  //getwidth of div
  return document.getElementById("divId").offsetWidth;
}
console.log(titleTagTester('temp'))
</script>
</html>

＆＃13;

对于此网络文档，控制台显示 600 。这不是您问题的好答案，因为目的是创建一个新文档并从该文档中获取所需的偏移量。但是，您的情况下的createHTMLDocument似乎无法正常工作，并且可以通过打印newDoc.readyState的值来找到它，结果证明它是未初始化的，而这又是偏移量的负责值为0。解决此问题的一种方法是使用onload事件处理程序调用该函数，而不是直接在脚本标记内调用该函数（例如<body onload="titleTagTester('tempString')">）。

新HTML文档的偏移量

1 个答案: