javascript - js中通过id读写内容和调用函数的问题-PHP中文网问答

我也不知道怎么用文字去描述我的这个问题，所以可能问题的题目不能很好的表达出我的疑问，这里先给点进来看看的各位程序猿哥哥道谢啦(⌒∇⌒)

是这样的，我写了一个简单的单击Save按钮后写入localStorage，然后单击Load从localStorage中读取信息并写入一个p里面的小功能,先上代码:




    
    Title



input your name:

问题来了，那几行注释里的代码是我自己写的，运行后没问题，后来我看了书上的代码，发现书上没有像我那样去定义这些变量，把html里面的那些元素取出来，而是直接就用了html里面元素的id。

按照书上的代码，都没有用getElementById把save按钮的btn_save获取到，怎么能这样直接btn_save.addEventListener('click',saveTo)调用方法呢？

还有下面的show这个变量也没有获取到，没有申明，怎么能直接用呢？

是不是js里面，可以用html里面元素的id直接调用方法呢？我有点晕了，谁能给我讲解一下吗，谢谢各位啦:D

补充下，我拍了书上代码的截图（为什么图片是横过来的...）：

全部回复(3)

PHP中文网2017-04-11 11:24:15 3楼

首先明确一件事，不太明白是否你按书上写的代码能运行。

一般从你的代码上来看（包括你注释掉的）应该运行没有问题。

如果要在js中执行方法一般是通过dom中的class或者id 来获取到dom对象。
然后再操作对象逻辑

ps：一个建议尽量在js中驼峰的方式来写变量名或者方法

赞 +0

添加回复

大家讲道理2017-04-11 11:24:15 2楼

是覺得有三種可能性：

<button id="btn_save" onclick="saveTo()">Save</button>
<button id="btn_load" onclick="loadFrom()">Load</button>

最後一個我覺得可能性不大，但是你該不會是看到這種寫法吧 $('#btn_save')?
是的話，這是一個 Javascript 的庫 jQuery ，封裝原本複雜的 Dom 操作
變成可以很簡單的使用

PHP中文网2017-04-11 11:24:15 1楼

html 中用 id 命名的任意元素在 js 中可以直接通过这个 id 来访问，不需要再去声明一遍

比如：

有一个输入框

<input id="test" value="1"/>

js中可以直接访问：

console.log(test.value);
//控制台输出 "1"