Question

我有一个wix网页，页面上带有HTML元素。我需要将该元素的文本放入包含JavaScript的iFrame中。我想将html元素的文本存储为iFrame javascript中的变量。

当我尝试下面的代码时，我的iFrame变量在网络控制台中显示为“未定义”。

<script>
var myElement = document.getElementById("#text15").text;
console.log(myElement);
</script>

Answer 1

JavaScript函数getElementById()接收应在DOM中搜索的id值的字符串作为参数。因此，您正在搜索：

<div id="#text15"></div>

要在DOM中查找此元素：

<div id="text15"></div>

您可以这样做：

var myElement = document.getElementById("text15").innerText;

或者，如果您喜欢在引用DOM中的元素时使用哈希符号，也可以尝试：

var myElement = document.querySelector("#text15").innerText;

两者的工作方式相同。另外，使用innerText作为标记内的内容。 JavaScript返回的DOM元素的text属性不存在。

注意：您不应直接在<script>标记中引用DOM元素。由于这些元素很可能在您调用它们时尚未准备就绪。

尝试：

<script>
window.onload = function() {
    var myElement = document.getElementById("#text15").innerText;
    console.log(myElement);
}
</script>

看两个例子：

var text1=document.querySelector("#myElement").innerText;
console.log(text1);

var text2=document.getElementById("myElement").innerText;
console.log(text2);

<div id="myElement">Hello!</div>

Answer 2

使用jQuery

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script type="text/javascript">
$(document).ready(function() {
  $('#inPut').click(function() {
  	var myElement = 
  		$('#text15').val();

    console.log(myElement);
    
  });
 
});		
</script>


</head>
<body>
	
		
<br>
			<input type='text' id='text15'>
				
					<button id='inPut'>Write to console</button>

<br>
	</div>

   </body>
</html>

将Wix HTML元素导入iFrame变量

2 个答案: