javascript第2讲:常用方法

1.confirm() 确认消息框

<script type="text/javascript">
            // 有返回值,如果确定则返回 true,取消则为 false
            msg = confirm('认识我吗?') //同步等待
            console.log(msg)
        </script>

2. prompt 输入确定框,即自己输入相应的内容

<script type="text/javascript">
        msg =   prompt('请输入来路:') //弹出框,优先级较高,当弹出框执行完毕后,才会执行 console
        console.log(msg)
        </script>

3. alert()

4.document.write()

  • 1.给文档当中写入内容,他会打开现有的html中body部分,然后再重新替换加入内容,如果交互操作时,原来有内容,会被替换掉
<script type="text/javascript">
            document.write('你好')
        </script>
    1. 插入html标签
        <script type="text/javascript">
            document.write("<button>按钮</button>")
        </script>       

5.document.body.innerHTML(不保留原有的内容)

将原有的body中的html内容替换为我们输入的内容,
替换也就意味着原有的html内容会丢失

<body>
            我是大魔王
<script type="text/javascript">
            document.body.innerHTML= "<ul><li>1</li><li>2</li></ul><a href='https://www.baidu.com'>111</a>"
        </script>
    </body>

当代码执行后,本来要输出的的文字 就被替换成 代码中写的html内容了

6.document.body.innerHTML=document.body.innerHTML+"XXX"

保留原有内容,并在原有的内容上进行增加

<body>
            我是大魔王
<script type="text/javascript">
            document.body.innerHTML= "<ul><li>1</li><li>2</li></ul><a href='https://www.baidu.com'>111</a>"
        </script>
    </body>

8. id 选择器(document.getElementById)

<div class="1" id="div1">
            
        </div>
        <script type="text/javascript">
            div = document.getElementById('div1')
            div.innerHTML='哈哈' //根据 id 获取元素,然后改变内容
                      div.onclick= function(){
                div.innerHTML='新的'
            } //事件通过匿名函数的方法来执行
        </script>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 一、JS前言 (1)认识JS 也许你已经了解HTML标记(也称为结构),知道了CSS样式(也称为表示),会使用HT...
    凛0_0阅读 2,818评论 0 8
  • 概要 64学时 3.5学分 章节安排 电子商务网站概况 HTML5+CSS3 JavaScript Node 电子...
    阿啊阿吖丁阅读 9,415评论 0 3
  •   JavaScript 与 HTML 之间的交互是通过事件实现的。   事件,就是文档或浏览器窗口中发生的一些特...
    霜天晓阅读 3,578评论 1 11
  • 第3章 基本概念 3.1 语法 3.2 关键字和保留字 3.3 变量 3.4 数据类型 5种简单数据类型:Unde...
    RickCole阅读 5,266评论 0 21
  • 原文: 有杕之杜,有睆其实。王事靡盬,继嗣我日。 日月阳止,女心伤止,征夫遑止。 有杕之杜,其叶萋萋。王事靡盬,我...
    东十八月阅读 196评论 0 1