js中加载指定的html代码,在js或JQuery中怎样判断页面html代码中含有指定名称的div元素..._IAmAngry.的博客-程序员ITS301

技术标签: js中加载指定的html代码  

在我们制作网页的过程中,想要在某个页面中的某一元素中添加新的内容,而不想改动那个页面,我们一般会直接在全局的jsz中直接加入document.getElementById("指定id")来给定指定元素新的内容,但在一些页面中没有指定id的div元素浏览器就会报错,影响后面的代码执行,

所以为了防止浏览器因为找不到指定名称的div元素而报错,我们需要在全局的js文件中判断哪些页面存在指定名称的元素再对其追加更丰富的内容.

示例:

这是元素1

假设我们想要判断页面中是否存在id名称为qtool-abcde的div元素该怎样实现?

1、js实现方法:

if(document.getElementById('qtool-abcde')) {

//找到元素

} else {

// 未找到元素执行的内容

}

2、使用jQuery插件实现则更为简单些:

在jquery插件中,存在的完善的代码处理机制,即使在网页中获取不到元素可能也不会报错,所以如果我们直接按照if($("#qtool-abcde")){}这样写来判断元素是否存在是错误的,会一直执行下去不管元素是否存在.因为$("#qtool-abcde")获取的是对象,不管页面中是否有这个元素

所以我们应该按以下代码来判断:

if($("#qtool-abcde").length > 0) {

//找到元素

} else {

// 未找到元素则

}

引入jQuery插件后只需要判断元素的长度是否为0则能够得出指定名称的div元素是否存在,而且还可以像($("#qtool-abcde img").length这样来组合检测页面id为qtool-abcde的元素中是否存在图片标签等.

当我们想要在qtool-abcde元素中增加一段新的文本时可以这样:

if($("#qtool-abcde").length > 0) {

$("#qtool-abcde").append("这是一段新的文字噢~~~.");

} else {

}

在jq中可以很方便的使用append()、prepend() 、after()、before()方法分别来在被选择的元素结尾、开头、之后、之前的位置添加新的文字或元素.

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_39545017/article/details/117706031

智能推荐

win10+pytorch+yolov3 训练爬取数据_BreakALegToday的博客-程序员ITS301

win10+yolov3+pytorch训练数据编译环境安装编译环境功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入编...

SPM安装教程_qq_42128826的博客-程序员ITS301_spm安装

SPM安装教程1、SPM工具的安装所需工具:Matlab R 2016b、SPM 12SPM 12下载地址:https://www.fil.ion.ucl.ac.uk/spm/(1)、将下载好的SPM12压缩包解压,将解压所得的文件SPM12复制到Matlab安装目录下的toolbox中(2)、进入Matlab,点击设置路径,点击添加文件夹,选择(1)中SPM12文件,点击确定,然后保存、退出。(3)、在命令行窗口中输入spm(4)、选择fMRI,显示如下。则SPM工具安装成功(5)、

.NET 反编译工具_Dzq_Boyka的博客-程序员ITS301_net反编译工具

原文:http://www.cnblogs.com/JamesLi2015/archive/2011/09/08/2170519.html#3406308Reflector是.NET开发中必备的反编译工具。即使没有用在反编译领域,也常常用它来检查程序集的命名规范,命名空间是否合理,组织类型的方法是否需要改善。举例说明,它有一个可以查看程序集完整名称的功能,请看下图这里的Name,是标识...

USB总线-USB协议简介(一)_业余程序员plus的博客-程序员ITS301_usb总线

1.简介USB是通用串行总线(Universal Serial Bus)的缩写。在USB总线出现之前,计算机与键盘、鼠标、扫描仪、打印机都使用专用的接口连接,不同设备的接口不能互用,扩展性很差,每次插拔设备都要关闭计算机,不支持热插拔,且通信速率很低。为了解决上述问题,USB总线诞生了。USB总线就好像一条管道,管道里流过的东西只要符合USB协议,至于具体流的是什么东西,USB总线并不关心,可以是自来水,可以是污水,可以是天然气,也可以是石油。对应具体的设备上,只要是支持USB协议的设备,都可以连接计算机

延迟队列浅析_猴子哥哥1024的博客-程序员ITS301

        早期需要延迟处理的业务场景,更多的是通过定时任务扫表,然后执行满足条件的记录,具有频率高、命中低、资源消耗大的缺点。随着消息中间件的普及,延迟消息可以很好的处理这种场景,本文主要介绍延迟消息的使用场景以及基于常见的消息中间件如何实现延迟队列,最后给出了一个在网易公开课使用延迟队列的实践。一、使用场景...

asp.net html document,asp.net - HTML document to PDF? - Stack Overflow_超级队长汉勤的博客-程序员ITS301

Last year, I did a project with PDFs, and I just learned the PDF format, for which I am very glad.The PDF specification is available freely, and PDF is quite accessible and easy to understand as a pro...

随便推点

mysql数据库表建pdm_mysql数据库导入到powerdisgner建模中(1)_weixin_39918690的博客-程序员ITS301

逆向工程,从mysql数据库生成pd数据模型。(环境:powderdesigner15.0;mysql5.1)1.必须先配置mysql的ODBC数据源。在控制面板数据源(ODBC)那里配置一个mysql的数据源,先到官方网站下载mysql的odbc的connector(如我下的是:mysql-connector-odbc-5.1.5-win32.msi),安装。即可在数据源配置那里看到mysql的...

python git库_积木成森的博客-程序员ITS301_git python 库

# -*- coding: utf-8 -*-# @Author: ChenJiaLiang# @Date: 2018-08-09 14:02:06#!/usr/bin/python#coding=utf-8import osimport subprocessimport pdbimport sys#sys.setdefaultencoding('utf-8')from subprocess import Popen, PIPE, STDOUTdef printCont.

Python老司机给上路新手的3点忠告_编程只为的博客-程序员ITS301

在你学习编程的过程中,是否有过以下经历,或正在面临类似的局面:● 网上找了很多资料,不知道从哪里看起●买了本书,过了很久也没有看完第一章●开始还能跟着写几行代码,后来突然就看不懂了●也看了些教程和视频,似乎明白了,但还是没法自己写代码●入门了很多次,每次过两个月就又全忘了对于初学者,尤其是自学者,太多问题可能成为你编程之路上的坎,一不小心就从入门到放弃了。...

matlab加速度转化为位移,Matlab加速度信号如何转为位移信号?_酸甜草莓二侠的博客-程序员ITS301

我现在也正在做这个,你看看这个程序,是从书上弄的。。%频域积分%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%clearclcclose all hidden%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%fni=input('频域积分-输入数据文件名:','s');fid=fopen(...

java mongo 条件查询_Java mongodb复杂多条件查询_十日君的博客-程序员ITS301

引入依赖org.springframework.bootspring-boot-starter-data-mongodb添加配置spring:data:mongodb:uri: mongodb://admin:[email protected]:27017,192.168.1.102:27017/transfer使用[email protected] MongoTemp...

转载_linux 两种方式 创建内核线程_williamwanglei的博客-程序员ITS301

kernel_thread()、daemonize()------------------------------------------------------int thread_func(void *arg){    /*      * 设置线程名 -- thread_name,ps可以看到的线程名     * 如果不使用daemonize设置内核线程名,并且kern