首页 >web前端 >html教程 > 正文

js如何修改html

原创2021-04-26 15:12:310512

js修改html的方法:1、改变html元素图片的src属性;2、改变html元素id属性;3、改变html元素class属性。

本教程操作环境:windows7系统、html5版,DELL G3电脑。

js修改html的方法:

1、在test.html页面,创建一个button按钮,用于点击执行函数修改html属性。

改变html元素图片的src属性,使用document.getElementById()方法获得html元素对象,再设置其src属性,实现改变图片路径。下面代码实现了当点击“改变属性”按钮时,把图片路径smiley.gif改变为images/0.png

237b62d694669210d5ff6591d5f4dbe.png

2、改变html元素id属性。使用document.getElementById()方法获得html元素对象,设置其value属性,实现改变id属性。例如,下面代码实现了当点击“改变属性”按钮时,把img元素的id属性值myImage改变为cimg

0c80d39bbefb3448edb2b4024bbe170.png

3、改变html元素class属性。使用document.getElementById()方法获得html元素对象,设置其class属性实现改变class属性。例如,下面代码实现了当点击“改变属性”按钮时,把img元素的class属性值myclass改变为chclass

aa98207831efdfe9182d07084c47a20.png

相关学习推荐:html视频教程

以上就是js如何修改html的详细内容,更多请关注php中文网其它相关文章!

php中文网最新课程二维码

声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理

  • 相关标签:javascript 修改html
  • 相关文章

    相关视频


    网友评论

    文明上网理性发言,请遵守 新闻评论服务协议

    我要评论
  • 专题推荐

    作者信息
    推荐视频教程
  • HTML5新特性基础视频教程HTML5新特性基础视频教程
  • html美团网页实战视频教程html美团网页实战视频教程
  • HTML极速入门(2018版)HTML极速入门(2018版)
  • HTML5基础精讲视频教程HTML5基础精讲视频教程
  • HTML中文参考手册HTML中文参考手册
  • 视频教程分类