zoukankan      html  css  js  c++  java
  • 2014年辛星解读Javascript之DOM高速入门

        在Javascript的知识中,有一个所谓的DOM。即文档对象模型,我们能够通过它来訪问HTML文档的元素,当网页被载入的时候,浏览器会去创建DOM,有了这个DOM。我们能够使用Javascript去改变页面中HTML元素和属性,改变CSS样式,能够对页面中的事件作出响应。

          首先就是查找一个HTML元素,我们能够通过三种方式来做到,即通过id、标签名和类名,通过id是使用getElementById方法。它是doucument的一个方法。通过标签名则能够使用getElementsByTagName方法,我们找到了HTML元素之后,能够通过使用innerHTML的方式来改动其值,比方看例如以下代码:

    <html>
    <p id = "tag">辛星</p>
    <script type="text/javascript">
    	document.getElementById("tag").innerHTML = "小倩";
    </script>
    </html>
    等我们看的时候,它就已经被改动了。例如以下截图:


         得到了这个HTML元素之后就能够改写它的一些属性。这里的innerHTML是比較常见的一个,至于HTML元素由什么属性,就看我们对HTML的理解了。

    要改变一个HTML的样式,我们能够通过使用得到HTML元素之后,通过它的style来进一步改动其属性,这里的写法和CSS非常类似,比方例如以下代码:

    <html>
    <p id = "tag">辛星</p>
    <script type="text/javascript">
    	document.getElementById("tag").innerHTML = "小倩";
    	document.getElementById("tag").style.color = "#00F";
    </script>
    </html>
    它会把我们的段落的内容改成”小倩“。而且把样式中的颜色改成蓝色。截图例如以下:



    这里和css里的写法是非常相似的,仅仅要css功底比較扎实,这里会感觉非常轻松。

  • 相关阅读:
    微软面试题_中文字符串转换为数字
    微软面试题_3个字母的组合
    LeetCode Notes_#1031_两个非重叠子数组的最大和
    剑指Offer_#57-II_和为 s 的连续正数序列
    LeetCode Notes_#560 和为k的子数组
    LeetCode Notes_#84 柱状图中最大的矩形
    LeetCode Notes_#221 最大正方形
    LeetCode Notes_#146 LRU缓存机制
    码云团队开发项目拉取与推送
    vue父子组件的双向绑定
  • 原文地址:https://www.cnblogs.com/cxchanpin/p/7240908.html
Copyright © 2011-2022 走看看