Vue 进阶（幺玖捌）：js 判断 document.getElementByid(““) 获得的对象是否存在

2021 年 11 月 13 日
本文字数：806 字
阅读完需：约 3 分钟

一、前言

如果通过document.getElementById("") document.getElementByName("") 等方式获得的对象不存在情况下，进行操作时会报错。因此需要首先判断该对象是否存在，以下两种判断方法，推荐使用第一种。

二、方法一: v==null

var v;v = document.getElementByIdx_x( "id ");if(v==null){//不存在，错误处理}else{//存在，正常处理}

复制代码

三、方法二: typeof(obj) == "undefined"

if (typeof(obj) == "undefined") {    //不存在，错误处理}else{//存在，正常处理}

复制代码

四、拓展阅读

开发过程中，经常需要使用console.log、console.info、alert等操作来输出内容，测试代码，而在生产环境之中，这些打印的东西最好是不要显示、特别是用户名、密码相关。

一个个去删除、注释显然是很麻烦的一件事，所以我们可以通过修改配置变量，实现在开发环境打印，而生产环境不打印。

修改方法如下：在项目的build/webpack.prod.conf.js文件之中，找到UglifyJsPlugin配置，在compress中添加如下代码即可。

new UglifyJsPlugin({  uglifyOptions: {    compress: {      warnings: false,      // 打包的时候移除console、debugger      drop_debugger: true, // 移除debugger      drop_console: true, // 移除console      pure_funcs: ['console.log','console.info']    }  },  sourceMap: config.build.productionSourceMap,  parallel: true}),

复制代码

另外，vue实例属性$options用来获取定义在data外的数据和方法。

应用示例如下：

<script>export default {  name: "optionsTest",  data() {    return {    };  },  //在data外面定义的属性和方法通过$options可以获取和调用  name: "CSDN",  age: 12,  testMethod() {    console.log("shq5785");  },  created() {      console.log(this.$options.name);  // CSDN    console.log(this.$options.age);  //12    this.$options.testMethod();  // shq5785    },</script>

复制代码

发布于: 4 小时前阅读数: 4

原文链接:【http://xie.infoq.cn/article/7ad8d13b427c50db895906db0】。文章转载请联系作者。

No Silver Bullet

关注

No Silver Bullet 2021.07.09 加入

岂曰无衣与子同袍

发布

暂无评论

创作场景

Vue 进阶（幺玖捌）：js 判断 document.getElementByid(““) 获得的对象是否存在

一、前言

二、方法一: v==null

三、方法二: typeof(obj) == "undefined"

四、拓展阅读

No Silver Bullet

评论