清除按钮应该在解析按钮下面并且与解析框有间距复制链接按钮应该是解析完成后出现了解析后的链接才显示出来需要改成清除功能为重置功能HTML代码：!DOCTYPE htmlhtmlhead title视频解析title meta charset=utf-8 meta name=viewport content=width=device-width initial-scale=10 link rel=st

修改后的HTML代码：

<!DOCTYPE html>
<html>
<head>
	<title>视频解析</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" href="style.css">
	<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
	<script src="script.js"></script>
</head>
<body>
	<div class="container">
		<h1>解析视频链接</h1>
		<div class="form-group">
			<label for="url">输入视频链接：</label>
			<input type="text" id="url" name="url" class="input" placeholder="请输入视频链接">
		</div>
		<div class="actions">
			<button id="submit" class="btn btn-primary">解析</button>
			<button id="clear" class="btn btn-secondary">重置</button>
		</div>
		<div class="result">
			<p><strong>解析中，请稍等<span class="dots">...</span></strong></p>
		</div>
		<div class="actions">
			<button id="copy" class="btn btn-secondary" style="display:none;">复制链接</button>
		</div>
	</div>
</body>
</html>

修改后的CSS样式：

.container {
	max-width: 600px;
	margin: 0 auto;
	padding: 20px;
	background-color: #f1f1f1;
	border-radius: 10px;
	box-shadow: 0 5px 10px rgba(0,0,0,0.1);
}

h1 {
	text-align: center;
	margin-bottom: 30px;
	color: #333;
}

.form-group {
	margin-bottom: 20px;
	position: relative;
}

label {
	display: block;
	margin-bottom: 5px;
	color: #333;
}

.input {
	width: 100%;
	padding: 10px;
	border: none;
	border-radius: 5px;
	background-color: #e1e1e1;
	font-size: 16px;
	color: #333;
}

.btn {
	padding: 10px 20px;
	border: none;
	border-radius: 5px;
	background-color: #007bff;
	color: #fff;
	font-size: 16px;
	cursor: pointer;
}

.btn:hover {
	background-color: #0069d9;
}

.btn-secondary {
	background-color: #6c757d;
}

.btn-secondary:hover {
	background-color: #5a6268;
}

.result {
	margin-top: 30px;
	padding: 20px;
	border-radius: 5px;
	display: none;
	background-color: #fff;
	box-shadow: 0 5px 10px rgba(0,0,0,0.1);
	max-width: 100%;
	word-break: break-all;
	position: relative;
}

.result p {
	margin-bottom: 10px;
}

.result a {
	color: #007bff;
}

.dots {
	animation: blink 1.2s infinite;
}

.actions {
	margin-top: 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

@keyframes blink {
	0% {
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

修改后的JavaScript代码：

$(document).ready(function() {
  $('#submit').click(function() {
    var url = $('#url').val().trim();
    if (url == '') {
      alert('请输入视频链接');
      return false;
    } else if (!isValidUrl(url)) {
      alert('请输入有效的视频链接');
      return false;
    }
    var api_url = 'https://ovoa.cc/api/Tencent_live.php?url=' + url;
    $('.result').html('<p><strong>解析中，请稍等<span class="dots">...</span></strong></p>').show();
    $('#copy').hide();
    $.get(api_url, function(data) {
      if (data.code == 200) {
        $('.result').html('<p><strong>解析结果：</strong></p><p><a href="' + data.url + '">' + data.url + '</a></p>');
        $('#copy').show();
      } else {
        $('.result').html('<p><strong>解析失败：</strong>' + data.msg + '</p>');
      }
    }).fail(function() {
      $('.result').html('<p><strong>请求失败：</strong>请稍后再试</p>');
    });
    $(this).prop('disabled', true);
  });

  $('#clear').click(function() {
    $('#url').val('');
    $('.result').hide();
    $('#copy').hide();
    $('#submit').prop('disabled', false);
  });

  $('#copy').click(function() {
    var url = $('.result a').attr('href');
    if (url) {
      navigator.clipboard.writeText(url);
    }
  });

  function isValidUrl(url) {
    var pattern = /^(http|https):\/\/[a-zA-Z0-9\-\.]+\.[a-zA-Z]{2,}(\/\S*)?$/;
    return pattern.test(url);
  }

  if (!navigator.clipboard) {
    $('#copy').prop('disabled', true);
  }
});

清除按钮应该在解析按钮下面并且与解析框有间距复制链接按钮应该是解析完成后出现了解析后的链接才显示出来需要改成清除功能为重置功能HTML代码：!DOCTYPE htmlhtmlhead title视频解析title meta charset=utf-8 meta name=viewport content=width=device-width initial-scale=10 link rel=st