首页 > 代码库 > 每天进步一点点-javascript-如何改变一段文字的内容

每天进步一点点-javascript-如何改变一段文字的内容

随着社会的进步,技术的一代代改革更新,现在的前端制作者的技术不能仅仅止步于html+css了,越来越多的企业单位,都开始要求前端能熟练使用javascript或者jquery等开发技术了,可是这些对于刚入门的童鞋们来说,还是很有挑战性的。接下来大家一起互相学习javascript吧(自己写的,可能表述什么的有不太对的地方,望大家海涵!)~

知识储备:

大家需要先认识一些javascript中很重要的单词:onclick(鼠标点击事件)、document(文档)、window(窗口)、getElementById(元素id)、innerHTML(改变html内容);

 

第一步:制作html文件(此处为了节省时间,我只写出body中的内容);

--------------------------------------------------------------------------------------------------------------------

<h1>我的第一段 JavaScript</h1>

<p id="demo">
JavaScript 能改变 HTML 元素的内容。
</p>

<button type="button" onclick="myFunction()">点击这里</button>

说明:首先,我们需要有一段话,并把标签绑定一个唯一的id;

 

第二步:书写javascript;

--------------------------------------------------------------------------------------------------------------------
<script>
function myFunction()
{
x=document.getElementById("demo");  // 找到元素
x.innerHTML="Hello JavaScript!";    // 改变内容
}
</script>

说明:写一个方法函数,此处用的函数名为myFunction,然后,先找到我们要改变内容的元素(刚加的id),其中document指的是文档,getElementById是找到元素,第一句话的意思就是,设置x变量为文档中的id名为demo的元素;最后使用javascript中的innerHTML属性来替换id为demo中的内容;

 

第三步:绑定事件的触发;

------------------------------------------------------------------------------------------------

说明:此处是当点击了type="button"的按钮后,通过onclick来触发执行myFunction()函数的;