2015-01-19 2 views
0

им действительно новичок в яваскрипт и им вроде застрял с двумя проблемами:дисплей Переменная JavaScript в HTML код

-first проблема: как я могу отобразить переменные в HTML коде, вот мое:

<script type="text/javascript"> 
var $first = 1000; 
var $seconde = 50; 
var $percentage = 0; 
function pourcentage(somme, but) { 
    percentage = ((somme/but) * 100);} 
function incremente() { 
    $first = $first + 10 ;} 
</script> 

и вот что им пытаются сделать:

<li><a href="#">first variable $first seconde one is $seconde</a></li> 

-2nd проблема заключается в том, как использовать функцию OnClick:

<li class="blue"><a href="#" onclick="incremente()">stuff</a></li>

спасибо за ваше время :)

+0

возможно дубликат [Как отобразить переменную JavaScript в HTML] (http://stackoverflow.com/questions/8765855/how-to-display-a-javascript-variable-into-html) –

+0

Вам предстоит пройти долгий путь ... – Shahar

+0

Да, единственные языки, которые я использовал для программирования, - это c, pascal и некоторый объект-o riented java:/ –

ответ

1

var $first = 1000; 
 
var $seconde = 50; 
 
var $percentage = 0; 
 
var place1=document.getElementById('first'); 
 
var place2=document.getElementById('second'); 
 
function pourcentage(somme, but) { 
 
    percentage = ((somme/but) * 100); 
 
    alert('pourcentage = '+percentage+'%'); 
 
} 
 
function incremente() { 
 
    
 
    $first = $first + 10 ; 
 
    place1.innerHTML=$first; 
 
    place2.innerHTML=$seconde; 
 
}
<a href="#">first variable is <span id="first"></span> and seconde one is<span id="second"></span></a> 
 
<br><button onclick="pourcentage(100,5)">pourcentage</button> 
 
<br><button onclick="incremente()">incremente</button>

+0

), которая отображает (первая переменная is a seconde one is) не показывает переменные:/ps: it отлично работал на фрагменте кода запуска * –

1

Вы, как правило, использовать рамки с каким-то шаблонами для достижения этой цели. Однако есть много способов вставлять переменные javascript в ваш html. Внутри вашего яваскрипт блока файла или сценария:

var $first = 1000; 
var $seconde = 50; 

//target the element whose html you want to edit 
var el = document.getElementById('targetMe'); 

//use the innerHTML() method of DOM elements to edit the HTML of the targeted element 
el.innerHTML = "first variable "+ $first +" second one is "+$seconde; 

, чтобы добавить событие в использовании функции addEventListener на узле.

el.addEventListener("click", pourcentage.bind(window, 100, 5), false); 
-2

приятно познакомиться с вами.

первый, чистый javascript трудно отобразить переменную в html напрямую. Если вы хотите сделать, как ваш код, проверить библиотеки JavaScript (AngularJS или hadlebar)

2-й

<html> 
... 
<script> 
function yourFunction() { 
    //your code in here.. 
} 

</script> 

... 

<li><a href="#" onclick="yourFunction()">something</a></li> 
Смежные вопросы