在html代码中加载javascript函数

我想使用JavaScript方法innerHTML读取多个div的值并将它们保存在变量中。这是javascript代码：在html代码中加载javascript函数

function llegirdata() 
{ 
    var spandies = document.getElementById('dies').innerHTML; 
    var spanhores = document.getElementById('hores').innerHTML; 
    var spanminuts = document.getElementById('minuts').innerHTML; 
    var spansegons = document.getElementById('segons').innerHTML; 
    console.log(spanhores); 
}

此代码位于名为temps.js的脚本中。该html代码是：

<head> 

<script type="text/javascript" src="js/temps.js"></script> 

</head> 
<body> 
<div class="contenidor"> 

<div id="clockdiv"> 
    <div> 
     <span id="dies">1</span> 
     <div class="smalltext">Dies</div> 
    </div> 
    <div> 
     <span id="hores">1</span> 
     <div class="smalltext">Hores</div> 
    </div> 
    <div> 
     <span id="minuts">40</span> 
     <div class="smalltext">Minuts</div> 
    </div> 
    <div> 
     <span class="segons">00</span> 
     <div class="smalltext">Segons</div> 
    </div> 

    <script language="javascript"> 
     llegirdata();  
    </script> 
</body>

当我在浏览器中运行代码spanhores变量的值不显示在控制台中。还有就是错误

无法读取空

的特性“的innerHTML”我知道这个错误意味着脚本的HTML代码和的innerHTML方法之前加载无法读取跨度ID = hores的价值。这是我不明白，因为我加载HTML代码后加载脚本。

我不想在html文件中键入javascript，因为我需要执行更多的函数来计算一些值。

如何显示spanhores变量的值？

感谢。

来源

2016-09-21 axmug

为什么downvote？好的问题，提供的代码，试图解决..？ – tymeJV

你的主要错误在于把脚本的所有类的变化，你不能忘记在你的html代码之前。

Uncaught TypeError: Cannot read property 'innerHTML' of null

函数运行并试图去包含在html中的那些值，但在那一点上没有定义。轻松解决这样的问题：

<body> 
<div class="contenidor"> 

<div id="clockdiv"> 
    <div> 
     <span id="dies">1</span> 
     <div class="smalltext">Dies</div> 
    </div> 
    <div> 
     <span id="hores">1</span> 
     <div class="smalltext">Hores</div> 
    </div> 
    <div> 
     <span id="minuts">40</span> 
     <div class="smalltext">Minuts</div> 
    </div> 
    <div> 
     <span id="segons">00</span> 
     <div class="smalltext">Segons</div> 
    </div> 

    <script type="text/javascript" src="js/temps.js"></script> 

</body>  
</html>

函数适用于所有情况。

来源

2016-09-21 22:20:13 adr1Script

感谢您的回答。我用你的答案adr1Script修正了错误。 – axmug

<span class="segons">00</span>

您犯了一个错字。类不是Id。

document.getElementById('segons')返回null因为您根本没有具有该ID的元素，而不是因为您试图快速阅读它。

来源

2016-09-21 20:33:05 Quentin

它可以在类名找到，但如果你使用的类名同名

var all = $(".TestClass").map(function() { 
 
     return this.innerHTML + " - js Test"; 
 
    }).get(); 
 

 
    $("p").html(all.join());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
 

 
    <div class="TestClass">Test One</div> 
 
    <div class="TestClass">Test Two</div> 
 
    <div class="TestC">Test Two</div> 
 

 

 
    <p></p>

来源

2016-09-21 21:21:37

在html代码中加载javascript函数

回答

相关问题