当前位置：首页 > article >正文

JS，jQuery常用语法记录

article 2024/10/24 21:36:41

JS，jQuery常用语法记录

JS常用语法:
1.操作剪切板 [可能无法在某些浏览器中正常工作]
document.execCommand("copy")/document.execCommand("cut")
    // 复制链接
    function doCopyLink(id){
        $("#hiddenUrl").val("/article/viewArticle?id=" + id);
        var url = document.getElementById("hiddenUrl");
        url.select();
        document.execCommand("Copy");
        alert("复制链接成功！");
    }

JQuery常用语法:
1.id选择器
$("#myElement").text(); [元素不存在返回undefined]
$("#myElement").text("Hello, world!");
追加元素使用append()或prepend()方法

2.事件处理程序：
使用on()方法来附加事件处理程序。
$("#myButton").on("click", function() { 
	alert("Button clicked!"); });
将在单击id为myButton的按钮时显示警报框。

3.获取和设置属性：
使用.attr()方法来获取或设置元素的属性。
$("#myImage").attr("src", "newimage.jpg");
将把id为myImage的图像的src属性设置为"newimage.jpg"。

4.获取和设置内容：
使用.text()和.html()方法来获取或设置元素的文本内容或HTML内容。
$("#myElement").text("Hello, world!");
将把id为myElement的元素的文本内容设置为"Hello, world!"。

5.添加或删除类：
使用.addClass()和.removeClass()方法来添加或删除元素的类。
$("#myElement").addClass("highlight");
将向id为myElement的元素添加名为"highlight"的类。

6.遍历元素：
使用.each()方法遍历匹配选择器的每个元素。
$("li").each(function() { console.log($(this).text()); });
将输出页面中每个li元素的文本内容。

7.发送AJAX请求：
使用.ajax()方法发送AJAX请求。
$.ajax({ 
	url: "example.php", 
	success: function(data) { console.log(data); } });

8.获取select标签内选中的标签
var selectedValue = $('select').find(':selected').val()/.text();

9.iframe打开新的页面
/**
* 查看所有业务随访计划*/
function getfollowNoticePlan(){
	window.frames["followModalFrame"].innerHTML = "";
	$('#followModalFrame').attr('src', BASE_PATH + "/FollowNoticePlan/followNoticePlanStatistics?trialId="+id);
	$('#followModal').modal('show');
}
//  modal弹窗
<div class="modal fade" id="followModal" tabindex="-1" role="dialog" aria-labelledby="countModalLabel" aria-hidden="true">
		<div class="modal-dialog"  style="width: 95%;">
			<div class="modal-content" >
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="followModalLabel">预约随访</h4>
				</div>
				<div class="modal-body" >
					<iframe src="" width="100%" id="followModalFrame" name="countFrame" style="border: 0px;min-height: 825px;"></iframe>
				</div>
			</div>
		</div>
	</div>


清除JS缓存 浏览器强制刷新: Ctrl+F5