Question

如果问题标题有点含糊，我很抱歉，我仍然是javascript的初学者（我打开编辑建议！）。如果您查看上面的屏幕截图，我有5个输入框，其中包含值。这些值是Google Places API返回的评分，每次用户搜索新位置时，这些值都会发生变化。我是这样展示的。（我将以健身房选项为例）。

Gymcallback功能（Calucluates该区域所有健身房的平均评级）

function gymCallback(results2, status2) {
        var totalRating = 0,
            ratedCount = 0; 

        results2.forEach(function( place ) {
            if (place.rating !== undefined) {
                ratedCount++; 
                totalRating += place.rating;
            }
        });


        var averageRating = results2.length == 0 ? 0 : totalRating / ratedCount; 
        var averageRatingRounded = averageRating.toFixed(1);


        var averageGymRatingTB = document.getElementById('gymAvgRating');
        averageGymRatingTB.value = averageRatingRounded;
    }

averageGymRatingTB值将被传递到屏幕截图中的输入框，如下所示：

<p>
Gyms: &nbsp; &nbsp; &nbsp; &nbsp; 
<input type="text" size="10" name="gymAvgRating" id="gymAvgRating" />
</p>

我的问题是，是否可以显示gym rating下一个＆＃34;健身＆＃34;在导航栏中？

导航栏中的健身列表选项

            <li data-toggle="collapse" data-target="#fitness" class="collapsed">
                <a onclick="clearMarkers();GymReport();" href="#"><i class="fa fa-heart fa-lg"></i> Fitness <span
                    class="arrow"></span></a>
            </li>

我已经使用＆＃39; test＆＃39;添加innerhtml元素，使用以下方法。作为我经过的价值，但这不会起作用，所以我不确定。

<li data-toggle="collapse" data-target="#fitness" class="collapsed">
                <a onclick="clearMarkers();GymReport();" href="#"><i class="fa fa-heart fa-lg"></i> Fitness <span
                    class="arrow"></span></a><h5 id = demo></h5>
            </li>

在我的javascript中，我使用了这个：

document.getElementById("demo").innerHTML = "test";

Answer 1

您只需在导航中添加跨度，将其存储在变量中并更改使用innerText的内容。

＆＃13;

function clearMarkers() {}

function GymReport() {}

var a = document.querySelector('li[data-target="#fitness"] > a'); //get the a in the menu
var fitnessScore = document.createElement("span"); //create a new span
a.appendChild(fitnessScore); // add the span to the a

function changeValue(v) {
  fitnessScore.innerText = Math.random();
}

＆＃13;

<ul>
  <li data-toggle="collapse" data-target="#fitness" class="collapsed">
    <a onclick="clearMarkers();GymReport();" href="#"><i class="fa fa-heart fa-lg"></i> Fitness <span
                    class="arrow"></span></a>
  </li>
</ul>


<input type="button" onclick='changeValue()' value="Change value">

＆＃13;

是否可以显示一个JavaScript变量，其值将在两个<li>标记之间发生变化？

1 个答案: